<!DOCTYPE html>
<!-- saved from url=(0047)https://juejin.im/post/5b854e1451882542fe28a53d -->
<html lang="zh-Hans"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no,viewport-fit=cover"><meta name="google-site-verification" content="cCHsgG9ktuCTgWgYfqCJql8AeR4gAne4DTZqztPoirE"><meta name="google-site-verification" content="nPvn9R5NJLsZKTv5VKIbn0OmkRcJ4PC6KdDoTX3n5Mw"><meta name="apple-itunes-app" content="app-id=987739104"><meta name="baidu-site-verification" content="qiK2a1kcFc"><meta name="360-site-verification" content="4c3c7d57d59f0e1a308462fbc7fd7e51"><meta name="sogou_site_verification" content="c49WUDZczQ"><style>body {
        font-size: 16px;
        line-height: 2;
      }
      a, button, input {
        margin: 1rem 1.5rem;
      }
      img {
        width: 0;
        height: 0;
      }
      #juejin {
        overflow-x: hidden;
      }</style><title data-vue-meta="true">深入理解贝塞尔曲线 - 掘金</title><link rel="apple-touch-icon" sizes="180x180" href="https://b-gold-cdn.xitu.io/favicons/v2/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="https://b-gold-cdn.xitu.io/favicons/v2/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="https://b-gold-cdn.xitu.io/favicons/v2/favicon-16x16.png"><link rel="manifest" href="https://b-gold-cdn.xitu.io/favicons/v2/manifest.json"><link rel="mask-icon" href="https://b-gold-cdn.xitu.io/favicons/v2/safari-pinned-tab.svg" color="#5bbad5"><link rel="shortcut icon" href="https://b-gold-cdn.xitu.io/favicons/v2/favicon.ico"><meta name="msapplication-config" content="https://b-gold-cdn.xitu.io/favicons/v2/browserconfig.xml"><meta name="theme-color" content="#ffffff"><link rel="search" title="掘金" href="https://b-gold-cdn.xitu.io/conf/search.xml" type="application/opensearchdescription+xml"><link rel="stylesheet" href="./深入理解贝塞尔曲线 - 掘金_files/ionicons.min.css"><link rel="stylesheet" href="./深入理解贝塞尔曲线 - 掘金_files/iconfont.css"><link href="./深入理解贝塞尔曲线 - 掘金_files/0.11b43bbc7239c183359c.css" rel="stylesheet"><script async="" src="./深入理解贝塞尔曲线 - 掘金_files/hm.js.下载"></script><script async="" src="./深入理解贝塞尔曲线 - 掘金_files/analytics.js.下载"></script><script type="text/javascript" async="" src="./深入理解贝塞尔曲线 - 掘金_files/vds.js.下载"></script><script type="text/javascript" async="" src="./深入理解贝塞尔曲线 - 掘金_files/collect-v.3.2.14.js.下载"></script><script charset="utf-8" src="./深入理解贝塞尔曲线 - 掘金_files/3.3442a17d176c67dc72ba.js.下载"></script><meta data-vmid="keywords" name="keywords" content="CSS,前端,图形学" data-vue-meta="true"><meta data-vmid="description" name="description" content="贝塞尔曲线（Bezier Curve）在计算机图形领域应用非常广泛，比如我们熟知的 CSS 动画、 Canvas 以及 Photoshop 等都可以看到贝塞尔曲线的身影。 文章目录 一、什么是贝塞尔曲线？ 二、贝塞尔曲线分为哪些类型？ 三、贝塞尔曲线是如何" data-vue-meta="true"></head><body><div id="juejin" data-v-2285b811=""><div class="global-component-box" data-v-2285b811=""><!----><div data-v-632f99e6="" data-v-2285b811="" class="alert-list alert-list"></div><div data-v-439b64e1="" data-v-2285b811="" class="suspension-panel suspension-panel"><button data-v-439b64e1="" title="回到顶部" class="btn to-top-btn" style=""><i data-v-439b64e1="" class="ion-android-arrow-dropup"></i></button><button data-v-439b64e1="" title="建议反馈" class="btn meiqia-btn" style=""><i data-v-439b64e1="" class="ion-chatbubble-working"></i></button></div><!----><!----><div class="emoji-barrage" data-v-4e8b2894="" data-v-2285b811=""><!----></div><!----><!----><div class="bind-phone-number-modal-box" data-v-70c421cc="" data-v-2285b811=""><div st:block="bindPhoneNumberModal" class="modal-mask" style="display:none;" data-v-70c421cc=""></div><form class="bind-phone-number-form" style="display:none;" data-v-70c421cc=""><i title="关闭" class="close-btn ion-close-round" data-v-70c421cc=""></i><h1 class="title" data-v-70c421cc="">提示</h1><h2 class="hint" data-v-70c421cc="">根据我国<a href="http://www.cac.gov.cn/2017-08/25/c_1121541842.htm" target="_blank" style="color:#007fff">《互联网跟帖评论服务管理规定》</a>，您需要绑定手机号后才可在掘金社区内发布内容。</h2><div class="input-group" data-v-70c421cc=""><div class="input-box" data-v-70c421cc=""><input maxlength="64" placeholder="请输入要绑定的手机号码" value="" class="input" data-v-70c421cc=""></div><!----><!----></div><button st:name="bindBtn" class="btn" data-v-70c421cc="">绑定手机</button></form></div></div><!----><div data-v-575c8a08="" data-v-0b1a4f9a="" data-v-2285b811="" class="view-container"><div data-v-575c8a08="" class="main-header-box"><header data-v-4c5e2361="" data-v-575c8a08="" class="main-header main-header"><div data-v-4c5e2361="" class="container"><a data-v-4c5e2361="" href="https://juejin.im/" class="logo"><img data-v-4c5e2361="" src="./深入理解贝塞尔曲线 - 掘金_files/logo.a7995ad.svg" alt="掘金" class="logo-img"><img data-v-4c5e2361="" src="./深入理解贝塞尔曲线 - 掘金_files/simplify-logo.3e3c253.svg" alt="掘金" class="mobile"></a><nav data-v-4c5e2361="" role="navigation" class="main-nav"><ul data-v-4c5e2361="" class="nav-list"><li data-v-4c5e2361="" class="main-nav-list"><div data-v-4c5e2361="" class="phone-show-menu"><span data-v-4c5e2361="">首页</span><div data-v-4c5e2361="" class="icon ion-arrow-down-b"></div></div><ul data-v-4c5e2361="" class="phone-hide"><li data-v-4c5e2361="" class="nav-item link-item route-active"><a data-v-4c5e2361="" href="https://juejin.im/">首页</a></li><li data-v-4c5e2361="" class="nav-item link-item activities"><a data-v-4c5e2361="" href="https://juejin.im/pins">沸点</a></li><li data-v-4c5e2361="" class="nav-item link-item"><a data-v-4c5e2361="" href="https://juejin.im/topics">话题</a></li><li data-v-4c5e2361="" class="nav-item link-item book"><a data-v-4c5e2361="" href="https://juejin.im/books">小册</a></li><li data-v-4c5e2361="" class="nav-item link-item"><a data-v-4c5e2361="" href="https://juejin.im/events/all">活动</a></li></ul></li><li data-v-4c5e2361="" class="nav-item search"><form data-v-4c5e2361="" role="search" class="search-form"><input data-v-4c5e2361="" type="search" maxlength="32" placeholder="搜索掘金" class="search-input"><img data-v-4c5e2361="" src="./深入理解贝塞尔曲线 - 掘金_files/juejin-search-icon.6f8ba1b.svg" alt="搜索" class="search-icon"></form></li><li data-v-4c5e2361="" class="nav-item add"><div data-v-4c5e2361="" class="add-group"><button data-v-4c5e2361="" class="add-btn">写文章</button><div data-v-4c5e2361="" class="more"><i data-v-4c5e2361="" class="more-icon ion-android-arrow-dropdown"></i></div><ul data-v-4c5e2361="" class="more-list"><li data-v-4c5e2361="" class="item">发布沸点</li><!----></ul></div><!----></li><li data-v-4c5e2361="" class="nav-item notification"><a data-v-4c5e2361="" class="app-link" href="https://juejin.im/notification" target="_blank"><i data-v-4c5e2361="" class="icon ion-android-notifications"></i><!----></a></li><li data-v-4c5e2361="" class="nav-item menu"><div data-v-e232e062="" data-v-4bc4293a="" data-v-4c5e2361="" data-src="https://mirror-gold-cdn.xitu.io/168e095e4f3a31aee1a?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded immediate" style="background-image: url(&quot;https://mirror-gold-cdn.xitu.io/168e095e4f3a31aee1a?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div><!----><ul data-v-4c5e2361="" class="nav-menu user-dropdown-list" style="display: none;"><div data-v-4c5e2361="" class="nav-menu-item-group"><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361=""><i data-v-4c5e2361="" class="fengwei fw-write"></i><span data-v-4c5e2361="">写文章</span></a></li><!----><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361=""><i data-v-4c5e2361="" class="fengwei fw-draft"></i><span data-v-4c5e2361="">草稿</span></a></li></div><div data-v-4c5e2361="" class="nav-menu-item-group"><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://juejin.im/user/5be40e49e51d451ad034ac69" class="link-icon"><i data-v-4c5e2361="" class="fengwei fw-person"></i><span data-v-4c5e2361="">我的主页</span><!----></a></li><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://juejin.im/user/5be40e49e51d451ad034ac69/likes"><img data-v-4c5e2361="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="zan"><span data-v-4c5e2361="">我赞过的</span></a></li><!----><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://juejin.im/user/5be40e49e51d451ad034ac69/collections"><img data-v-4c5e2361="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="collect"><span data-v-4c5e2361="">我的收藏集</span></a></li><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://juejin.im/user/5be40e49e51d451ad034ac69/books?type=bought"><i data-v-4c5e2361="" class="fengwei fw-bought"></i><span data-v-4c5e2361="">已购</span></a></li><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://juejin.im/subscribe"><i data-v-4c5e2361="" class="fengwei fw-tag"></i><span data-v-4c5e2361="">标签管理</span></a></li></div><div data-v-4c5e2361="" class="nav-menu-item-group"><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://juejin.im/user/settings"><i data-v-4c5e2361="" class="fengwei fw-setting"></i><span data-v-4c5e2361="">设置</span></a></li><li data-v-4c5e2361="" class="nav-menu-item more"><a data-v-4c5e2361=""><i data-v-4c5e2361="" class="fengwei fw-info"></i><span data-v-4c5e2361="">关于</span><i data-v-4c5e2361="" class="ion-chevron-right more-icon"></i></a><ul data-v-4c5e2361="" class="nav-menu more-dropdown-list"><div data-v-4c5e2361="" class="nav-menu-item-group"><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://juejin.im/app" target="_blank">下载应用</a></li><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://juejin.im/about" target="_blank">关于</a></li><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://xitu.io/jobs" target="_blank">加入我们</a></li><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://github.com/xitu/gold-miner" rel="nofollow noopener noreferrer" target="_blank">翻译计划</a></li><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361="" href="https://bd.juejin.im/?utm_campaign=bd&amp;utm_source=web&amp;utm_medium=nav" target="_blank">合作伙伴</a></li></div></ul></li></div><div data-v-4c5e2361="" class="nav-menu-item-group"><li data-v-4c5e2361="" class="nav-menu-item"><a data-v-4c5e2361=""><i data-v-4c5e2361="" class="fengwei fw-logout"></i><span data-v-4c5e2361="">登出</span></a></li></div></ul></li><!----><!----></ul></nav></div></header></div><main data-v-575c8a08="" class="container main-container"><div data-v-0b1a4f9a="" data-v-575c8a08="" class="view column-view"><div data-v-0b1a4f9a="" data-v-575c8a08="" class="main-area article-area shadow"><article data-v-0b1a4f9a="" itemscope="itemscope" itemtype="http://schema.org/Article" class="article" data-v-575c8a08=""><meta itemprop="url" content="https://juejin.im/post/5b854e1451882542fe28a53d"><meta itemprop="headline" content="深入理解贝塞尔曲线"><meta itemprop="keywords" content="CSS,前端,图形学"><meta itemprop="datePublished" content="2018-08-28T13:38:37.700Z"><meta itemprop="image" content="https://user-gold-cdn.xitu.io/2018/8/28/16580c3091ff1aaf?w=1280&amp;h=720&amp;f=png&amp;s=36367"><div itemprop="author" itemscope="itemscope" itemtype="http://schema.org/Person"><meta itemprop="name" content="与我常在Jerry"><meta itemprop="url" content="https://juejin.im/user/57de657179bc440065e34999"></div><div itemprop="publisher" itemscope="itemscope" itemtype="http://schema.org/Organization"><meta itemprop="name" content="掘金"><div itemprop="logo" itemscope="itemscope" itemtype="https://schema.org/ImageObject"><meta itemprop="url" content="https://b-gold-cdn.xitu.io/icon/icon-white-180.png"><meta itemprop="width" content="180"><meta itemprop="height" content="180"></div></div><div data-v-0b1a4f9a="" class="author-info-block"><a data-v-0b1a4f9a="" href="https://juejin.im/user/57de657179bc440065e34999" target="_blank" rel="" class="avatar-link"><div data-v-e232e062="" data-v-4bc4293a="" data-v-0b1a4f9a="" data-src="https://user-gold-cdn.xitu.io/2016/11/30/cf6efcedc766022278fc65bc2daa8dd2?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2016/11/30/cf6efcedc766022278fc65bc2daa8dd2?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div></a><div data-v-0b1a4f9a="" class="author-info-box"><a data-v-b8de4708="" data-v-0b1a4f9a="" href="https://juejin.im/user/57de657179bc440065e34999" target="_blank" rel="" class="username username ellipsis">与我常在Jerry<a data-v-b9e98e56="" data-v-b8de4708="" href="https://juejin.im/book/5c90640c5188252d7941f5bb/section/5c9065385188252da6320022" target="_blank" rel="" class="rank"><img data-v-b9e98e56="" src="./深入理解贝塞尔曲线 - 掘金_files/lv-2.f597b88.svg" alt="lv-2"></a></a><div data-v-0b1a4f9a="" class="meta-box"><time data-v-0b1a4f9a="" datetime="2018-08-28T13:38:37.700Z" title="Tue Aug 28 2018 21:38:37 GMT+0800 (香港标准时间)" class="time">2018年08月28日</time><span data-v-0b1a4f9a="" class="views-count">阅读 12528</span><!----></div></div><button data-v-1de19339="" data-v-0b1a4f9a="" class="follow-button follow">关注</button></div><div data-v-e232e062="" data-v-02a6947c="" data-v-0b1a4f9a="" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580c3091ff1aaf?imageView2/1/w/1304/h/734/q/85/format/webp/interlace/1" class="lazy thumb article-hero loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2018/8/28/16580c3091ff1aaf?imageView2/1/w/1304/h/734/q/85/format/webp/interlace/1&quot;); background-size: cover;"></div><h1 data-v-0b1a4f9a="" class="article-title">深入理解贝塞尔曲线</h1><div data-v-0b1a4f9a="" data-id="5b85505de51d4538a423d8a8" itemprop="articleBody" class="article-content"><blockquote>
<p>贝塞尔曲线（Bezier Curve）在计算机图形领域应用非常广泛，比如我们熟知的 CSS 动画、 Canvas 以及 Photoshop 等都可以看到贝塞尔曲线的身影。</p>
</blockquote>
<h2 class="heading" data-id="heading-0">文章目录</h2>
<ul>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#%E4%B8%80%E3%80%81%E4%BB%80%E4%B9%88%E6%98%AF%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF%EF%BC%9F">一、什么是贝塞尔曲线？</a></li>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#%E4%BA%8C%E3%80%81%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF%E5%88%86%E4%B8%BA%E5%93%AA%E4%BA%9B%E7%B1%BB%E5%9E%8B%EF%BC%9F">二、贝塞尔曲线分为哪些类型？</a></li>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#%E4%B8%89%E3%80%81%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF%E6%98%AF%E5%A6%82%E4%BD%95%E7%BB%98%E5%88%B6%E5%87%BA%E6%9D%A5%E7%9A%84%EF%BC%9F">三、贝塞尔曲线是如何绘制出来的？</a></li>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#%E5%9B%9B%E3%80%81%E5%A6%82%E4%BD%95%E6%B1%82%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF%E4%B8%8A%E7%9A%84%E7%82%B9%E5%9D%90%E6%A0%87%EF%BC%9F">四、如何求贝塞尔曲线上的点坐标？</a>
<ul>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#1%E3%80%81%E4%B8%80%E9%98%B6%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF">1、一阶贝塞尔曲线</a></li>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#2%E3%80%81%E4%BA%8C%E9%98%B6%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF">2、二阶贝塞尔曲线</a></li>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#3%E3%80%81%E4%B8%89%E9%98%B6%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF">3、三阶贝塞尔曲线</a></li>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#4%E3%80%81%E5%A4%9A%E9%98%B6%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF">4、多阶贝塞尔曲线</a></li>
</ul>
</li>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#%E4%BA%94%E3%80%81%E5%A6%82%E4%BD%95%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E7%B1%BB%E4%BC%BCCSS%E4%B8%ADeasing%E5%B1%9E%E6%80%A7%E7%9A%84%E4%B8%89%E9%98%B6%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF%E6%9E%84%E9%80%A0%E5%87%BD%E6%95%B0%EF%BC%9F">五、如何实现一个类似CSS中easing属性的三阶贝塞尔曲线构造函数？</a></li>
<li><a target="_blank" href="https://juejin.im/post/5b854e1451882542fe28a53d#%E5%85%AD%E3%80%81%E5%A6%82%E4%BD%95%E7%94%A8%E9%AB%98%E9%98%B6%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF%E8%A1%A8%E7%A4%BA%E4%BD%8E%E9%98%B6%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF%EF%BC%9F">六、如何用高阶贝塞尔曲线表示低阶贝塞尔曲线？</a></li>
</ul>
<p><a name="一、什么是贝塞尔曲线？"></a></p>
<h2 class="heading" data-id="heading-1">一、什么是贝塞尔曲线？</h2>
<p>贝塞尔曲线于 1962 年，由法国工程师皮埃尔·贝济埃（Pierre Bézier）所广泛发表，他运用贝塞尔曲线来为汽车的主体进行设计。</p>
<p>贝塞尔曲线主要用于二维图形应用程序中的数学曲线，曲线由起始点，终止点（也称锚点）和控制点组成，通过调整控制点，通过一定方式绘制的贝塞尔曲线形状会发生变化。后面会具体介绍绘制的方法。</p>
<p>在计算机图形学中贝赛尔曲线的运用很广泛，例如Photoshop中的钢笔效果，Flash5的贝塞尔曲线工具，在软件GUI开发中一般也会提供对应的方法来实现贝赛尔曲线，我们熟知的CSS动画过渡时间函数也是通过贝塞尔曲线（三阶贝塞尔曲线）获取的。</p>
<p><a name="二、贝塞尔曲线分为哪些类型？"></a></p>
<h2 class="heading" data-id="heading-2">二、贝塞尔曲线分为哪些类型？</h2>
<p>贝塞尔曲线根据<em>控制点</em>的数量分为：</p>
<ul>
<li>一阶贝塞尔曲线（2 个控制点）</li>
<li>二阶贝塞尔曲线（3 个控制点）</li>
<li>三阶贝塞尔曲线（4 个控制点）</li>
<li>n阶贝塞尔曲线（<img alt="n+1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation">个控制点）</li>
</ul>
<p><a name="三、贝塞尔曲线是如何绘制出来的？"></a></p>
<h2 class="heading" data-id="heading-3">三、贝塞尔曲线是如何绘制出来的？</h2>
<p>下图为一个三阶的贝塞尔曲线，包括四个控制点，分别为<img alt="P_0,P_1,P_2,P_3" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(1)">。</p>
<p></p><figure><img alt="三阶贝塞尔曲线" class="lazyload inited loaded" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580bb43ffa1be4?imageView2/0/w/1280/h/960/format/webp/ignore-error/1" data-width="300" data-height="188" src="./深入理解贝塞尔曲线 - 掘金_files/16580bb43ffa1be4"><figcaption></figcaption></figure><p></p>
<blockquote>
<p>那我们通过控制点是怎么绘制出贝塞尔曲线的呢？</p>
</blockquote>
<p>通过上图的三阶贝塞尔曲线举例，基本的步骤如下：</p>
<ol>
<li>四个控制点通过先后顺序进行连接，形成了三条线段，也就是上图中的<img alt="P_0P_1,P_1P_2,P_2P_3" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(2)">，然后通过一个参数<img alt="t,其中 t\in[0,1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(3)">，该参数的值等于线段上某一个点距离起点的长度除以线段长度。就比如<img alt="P_0P_1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(4)">线段上有一个点<img alt="P_0^{&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(5)">，此时<img alt="t" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(6)">的值就是<img alt="\frac{P_0P_0^{&#39;}}{P_0P_1}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(7)">，其中<img alt="P_0^{&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(5)">位置如下图所示。</li>
</ol>
<p></p><figure><img alt="bezier-01" class="lazyload inited loaded" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580bb950510b5b?imageView2/0/w/1280/h/960/format/webp/ignore-error/1" data-width="300" data-height="188" src="./深入理解贝塞尔曲线 - 掘金_files/16580bb950510b5b"><figcaption></figcaption></figure><p></p>
<ol start="2">
<li>接下来对每一条线段做同样的操作，得到三个控制点<img alt="P_0^{&#39;},P_1^{&#39;},P_2^{&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(8)">，如下图所示。</li>
</ol>
<p></p><figure><img alt="bezier-02" class="lazyload inited loaded" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580bc4e1340d75?imageView2/0/w/1280/h/960/format/webp/ignore-error/1" data-width="300" data-height="188" src="./深入理解贝塞尔曲线 - 掘金_files/16580bc4e1340d75"><figcaption></figcaption></figure><p></p>
<ol start="3">
<li>然后对这三个控制点重复第1步操作，得出两个控制点<img alt="P_0^{&#39;&#39;},P_1^{&#39;&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(9)">，如下图所示。</li>
</ol>
<p></p><figure><img alt="bezier-03" class="lazyload inited loaded" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580bca06ffc16f?imageView2/0/w/1280/h/960/format/webp/ignore-error/1" data-width="275" data-height="166" src="./深入理解贝塞尔曲线 - 掘金_files/16580bca06ffc16f"><figcaption></figcaption></figure><p></p>
<ol start="4">
<li>最后再使用同样的方法可以得到，最终的一个点<img alt="P_0^{&#39;&#39;&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(10)">，如下图所示，此时这个点就是贝塞尔曲线上的一个点。</li>
</ol>
<p></p><figure><img alt="bezier-04" class="lazyload inited loaded" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580bcdf090275c?imageView2/0/w/1280/h/960/format/webp/ignore-error/1" data-width="275" data-height="166" src="./深入理解贝塞尔曲线 - 掘金_files/16580bcdf090275c"><figcaption></figcaption></figure><p></p>
<p>通过控制<img alt="t" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(6)">的值，由 0 增加至 1，就绘制出了一条由起点<img alt="P_0" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(11)">至终点<img alt="P_1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(12)">的贝塞尔曲线。</p>
<p>你可以通过下面这个动画直观感受一下绘制的过程：</p>
<p></p><figure><img alt="三阶贝塞尔曲线绘制过程" class="lazyload inited loaded" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580c05ecb4ae6e?imageslim" data-width="240" data-height="100" src="./深入理解贝塞尔曲线 - 掘金_files/16580c05ecb4ae6e"><figcaption></figcaption></figure><p></p>
<p><a name="四、如何求贝塞尔曲线上的点坐标？"></a></p>
<h2 class="heading" data-id="heading-4">四、如何求贝塞尔曲线上的点坐标？</h2>
<p><a name="1、一阶贝塞尔曲线"></a></p>
<h3 class="heading" data-id="heading-5">1、一阶贝塞尔曲线</h3>
<p></p><figure><img alt="一阶贝塞尔曲线绘制过程" class="lazyload inited loaded" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580bfa851b3efe?imageslim" data-width="240" data-height="100" src="./深入理解贝塞尔曲线 - 掘金_files/16580bfa851b3efe"><figcaption></figcaption></figure><p></p>
<p>对于一阶贝塞尔曲线，我们可以通过几何知识，很容易根据<img alt="t" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(6)">的值得出线段上那个点的坐标：</p>
<figure><img alt="B_{1}(t) = P_0 + (P_1 - P_0)t" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(13)"></figure>
<p>然后可以得出：</p>
<figure><img alt="B_{1}(t) = (1 - t)P_0 + tP_1,t\in[0,1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(14)"></figure>
<p><a name="2、二阶贝塞尔曲线"></a></p>
<h3 class="heading" data-id="heading-6">2、二阶贝塞尔曲线</h3>
<p></p><figure><img alt="二阶贝塞尔曲线绘制过程" class="lazyload inited loaded" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580c01d391bd2b?imageslim" data-width="240" data-height="100" src="./深入理解贝塞尔曲线 - 掘金_files/16580c01d391bd2b"><figcaption></figcaption></figure><p></p>
<p>对于二阶贝塞尔曲线，其实你可以理解为：在<img alt="P_0P_1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(4)">上利用一阶公式求出点<img alt="P_0^{&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(5)">，然后在<img alt="P_1P_2" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(15)">上利用一阶公式求出点<img alt="P_1^{&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(16)">，最后在<img alt="P_0^{&#39;}P_1^{&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(17)">上再利用一阶公式就可以求出最终贝塞尔曲线上的点<img alt="P_0{&#39;&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(18)">。具体推导过程如下：</p>
<blockquote>
<p>先求出线段上的控制点。</p>
</blockquote>
<figure><img alt="P_0^{&#39;} = (1 - t)P_0 + tP_1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(19)"></figure>
<figure><img alt="P_1^{&#39;} = (1 - t)P_1 + tP_2" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(20)"></figure>
<blockquote>
<p>将上面的公式带入至下列公式中：</p>
</blockquote>
<figure><img alt="B_{2}(t) = (1 - t)P_0^{&#39;} + tP_1^{&#39;}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(21)"></figure>
<figure><img alt="= (1 - t)((1 - t)P_0 + tP_1) + t((1 - t)P_1 + tP_2)" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(22)"></figure>
<figure><img alt="= (1 - t)^2P_0 + 2t(1 - t)P_1 + t^2P_2" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(23)"></figure>
<blockquote>
<p>得出以下公式：</p>
</blockquote>
<figure><img alt="B_{2}(t) = (1 - t)^2P_0 + 2t(1 - t)P_1 + t^2P_2 , t\in[0, 1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(24)"></figure>
<p><a name="3、三阶贝塞尔曲线"></a></p>
<h3 class="heading" data-id="heading-7">3、三阶贝塞尔曲线</h3>
<p></p><figure><img alt="三阶贝塞尔曲线绘制过程" class="lazyload inited loaded" data-src="https://user-gold-cdn.xitu.io/2018/8/28/16580c05ecb4ae6e?imageslim" data-width="240" data-height="100" src="./深入理解贝塞尔曲线 - 掘金_files/16580c05ecb4ae6e"><figcaption></figcaption></figure><p></p>
<blockquote>
<p>与二阶贝塞尔曲线类似，可以通过相同的方法得出以下坐标公式：</p>
</blockquote>
<figure><img alt="B_{3}(t) = (1 - t)^3P_0 + 3t(1 - t)^2P_1 + 3t^2(1 - t)P_2 + t^3P_3 , t\in[0, 1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(25)"></figure>
<p><a name="4、多阶贝塞尔曲线"></a></p>
<h3 class="heading" data-id="heading-8">4、多阶贝塞尔曲线</h3>
<p>这里我就直接把<img alt="n" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(26)">阶贝塞尔曲线公式给出来了，有兴趣的同学可以自行研究一下。</p>
<figure><img alt="B(t) = \sum_{i=0}^{n}C_n^{i}P_i(1-t)^{n-i}t^i,t\in[0,1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(27)"></figure>
<p>即：</p>
<figure><img alt="B(t) = \sum_{i=0}^{n}P_ib_{i,n}(t),t\in[0,1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(28)"></figure>
<blockquote>
<p>公式中<img alt="C_n^i" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(29)">的值为<img alt="\frac{n!}{(n - i)!\cdot i!}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(30)">，与统计学有关，有兴趣的同学可以看一看我的<a target="_blank" href="https://segmentfault.com/a/1190000010349497" rel="nofollow noopener noreferrer">这篇文章</a>。</p>
</blockquote>
<p>其中<img alt="b_{i,n}(t)" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(31)">的值为：</p>
<figure><img alt="b_{i,n}(t)=C_n^{i}(1-t)^{n-i}t^i,其中i=0,1,...,n" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(32)"></figure>
<p><a name="五、如何实现一个类似CSS中easing属性的三阶贝塞尔曲线构造函数？"></a></p>
<h2 class="heading" data-id="heading-9">五、如何实现一个类似CSS中easing属性的三阶贝塞尔曲线构造函数？</h2>
<blockquote>
<p>如果要实现一个这样的三阶贝塞尔曲线，我们需要不仅需要获取到一些曲线上的点，还需要通过x轴获取y轴坐标。</p>
</blockquote>
<p>CSS中的easing贝塞尔曲线有一个特点，那就是起点和终点是固定的，也就是分别是<img alt="[0, 0],\ [1,1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(33)">。所以未知的点就只有两个，也就是需要传入四个值，并且这四个值的范围需要在<img alt="[0,1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(34)">内。</p>
<p>所以我们需要创建一个类CubicBezier，它拥有属性<code>controlPoints</code>：</p>
<pre><code class="hljs javascript copyable" lang="javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">CubicBezier</span> </span>{
  <span class="hljs-keyword">constructor</span>(x1, y1, x2, y2) {
    <span class="hljs-keyword">this</span>.controlPoints = [x1, y1, x2, y2];
  }
}
<span class="copy-code-btn">复制代码</span></code></pre><p>通过上述代码初始化以后，我们还需要根据t（取值范围为<img alt="[0, 1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(35)">）值获取坐标，以及一个曲线上坐标集合的数组。另外还需要使用三阶贝塞尔公式：</p>
<figure><img alt="B_{2}(t) = (1 - t)^3P_0 + 3t(1 - t)^2P_1 + 3t^2(1 - t)P_2 + t^3P_3 , t\in[0, 1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(36)"></figure>
<blockquote>
<p>因为<img alt="P_0" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(11)">点坐标为[0, 0]，<img alt="P_1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(12)">点坐标为<img alt="[1, 1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(37)">为所以公式进而可以写成：</p>
</blockquote>
<figure><img alt="B_{3, x}(t) = 3t(1 - t)^2x_1 + 3t^2(1 - t)x_2 + t^3 , t\in[0, 1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(38)"></figure>
<figure><img alt="B_{3, y}(t) = 3t(1 - t)^2y_1 + 3t^2(1 - t)y_2 + t^3 , t\in[0, 1]" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(39)"></figure>
<pre><code class="hljs javascript copyable" lang="javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">CubicBezier</span> </span>{
  <span class="hljs-keyword">constructor</span>(x1, y1, x2, y2) {
    <span class="hljs-keyword">this</span>.controlPoints = [x1, y1, x2, y2];
  }

  getCoord(t) {
    <span class="hljs-comment">// 如果t取值不在0到1之间，则终止操作</span>
    <span class="hljs-keyword">if</span> (t &gt; <span class="hljs-number">1</span> || t &lt; <span class="hljs-number">0</span>) <span class="hljs-keyword">return</span>;
    <span class="hljs-keyword">const</span> _t = <span class="hljs-number">1</span> - t;
    <span class="hljs-keyword">const</span> [ x1, y1, x2, y2 ] = <span class="hljs-keyword">this</span>.controlPoints;
    <span class="hljs-keyword">const</span> coefficient1 = <span class="hljs-number">3</span> * t * <span class="hljs-built_in">Math</span>.pow(_t, <span class="hljs-number">2</span>);
    <span class="hljs-keyword">const</span> coefficient2 = <span class="hljs-number">3</span> * _t * <span class="hljs-built_in">Math</span>.pow(t, <span class="hljs-number">2</span>);
    <span class="hljs-keyword">const</span> coefficient3 = <span class="hljs-built_in">Math</span>.pow(t, <span class="hljs-number">3</span>);
    <span class="hljs-keyword">const</span> px = coefficient1 * x1 + coefficient2 * x2 + coefficient3;
    <span class="hljs-keyword">const</span> py = coefficient1 * y1 + coefficient2 * y2 + coefficient3;
    <span class="hljs-comment">// 结果只保留三位有效数字</span>
    <span class="hljs-keyword">return</span> [<span class="hljs-built_in">parseFloat</span>(px.toFixed(<span class="hljs-number">3</span>)), <span class="hljs-built_in">parseFloat</span>(py.toFixed(<span class="hljs-number">3</span>))];
  }
}
<span class="copy-code-btn">复制代码</span></code></pre><p>利用上述的Bezier类，我们就可以根据两个控制点构建Bezier实例，通过这个实例我们可以根据t值，获取点上的近似值。</p>
<blockquote>
<p>那么如果我们想要根据x轴坐标值，来获取y轴坐标时，我们该怎么做呢？</p>
</blockquote>
<p>这里我使用了一个近似处理的办法，具体如下：</p>
<ol>
<li>先获取离需要求值点最近的两个点。</li>
<li>然后通过这两个点可以得到一个直线方程。</li>
<li>最后通过将x轴坐标传入直线方程中，就可以近似求得y轴坐标值了。</li>
</ol>
<p>所以我们需要进一步改造Bezier构造函数，需要缓存固定数量坐标数组的属性<code>coords</code>，以及获取<code>coords</code>的方法<code>getCoordsArray</code>，最后还有获取y轴坐标的方法<code>getY</code>，具体的实现方法如下：</p>
<pre><code class="hljs javascript copyable" lang="javascript"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">CubicBezier</span> </span>{
  <span class="hljs-keyword">constructor</span>(x1, y1, x2, y2) {
    <span class="hljs-keyword">const</span> precision = <span class="hljs-number">100</span>;
    <span class="hljs-keyword">this</span>.controlPoints = [x1, y1, x2, y2];
    <span class="hljs-keyword">this</span>.coords = <span class="hljs-keyword">this</span>.getCoordsArray(precision);
  }
  
  getCoord(t) {
    <span class="hljs-comment">// 如果t取值不在0到1之间，则终止操作</span>
    <span class="hljs-keyword">if</span> (t &gt; <span class="hljs-number">1</span> || t &lt; <span class="hljs-number">0</span>) <span class="hljs-keyword">return</span>;
    <span class="hljs-keyword">const</span> _t = <span class="hljs-number">1</span> - t;
    <span class="hljs-keyword">const</span> [ x1, y1, x2, y2 ] = <span class="hljs-keyword">this</span>.controlPoints;
    <span class="hljs-keyword">const</span> coefficient1 = <span class="hljs-number">3</span> * t * <span class="hljs-built_in">Math</span>.pow(_t, <span class="hljs-number">2</span>);
    <span class="hljs-keyword">const</span> coefficient2 = <span class="hljs-number">3</span> * _t * <span class="hljs-built_in">Math</span>.pow(t, <span class="hljs-number">2</span>);
    <span class="hljs-keyword">const</span> coefficient3 = <span class="hljs-built_in">Math</span>.pow(t, <span class="hljs-number">3</span>);
    <span class="hljs-keyword">const</span> px = coefficient1 * x1 + coefficient2 * x2 + coefficient3;
    <span class="hljs-keyword">const</span> py = coefficient1 * y1 + coefficient2 * y2 + coefficient3;
    <span class="hljs-comment">// 结果只保留三位有效数字</span>
    <span class="hljs-keyword">return</span> [<span class="hljs-built_in">parseFloat</span>(px.toFixed(<span class="hljs-number">3</span>)), <span class="hljs-built_in">parseFloat</span>(py.toFixed(<span class="hljs-number">3</span>))];
  }
  
  getCoordsArray(precision) {
    <span class="hljs-keyword">const</span> step = <span class="hljs-number">1</span> / (precision + <span class="hljs-number">1</span>);
    <span class="hljs-keyword">const</span> result = [];
    <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> t = <span class="hljs-number">0</span>; t &lt;= precision + <span class="hljs-number">1</span>; t++) {
      result.push(<span class="hljs-keyword">this</span>.getCoord(t * step));
    }
    <span class="hljs-keyword">this</span>.coords = result;
    <span class="hljs-keyword">return</span> result;
  }
  
  getY(x) {
    <span class="hljs-keyword">if</span> (x &gt;= <span class="hljs-number">1</span>) <span class="hljs-keyword">return</span> <span class="hljs-number">1</span>;
    <span class="hljs-keyword">if</span> (x &lt;= <span class="hljs-number">0</span>) <span class="hljs-keyword">return</span> <span class="hljs-number">0</span>;
    <span class="hljs-keyword">let</span> startX = <span class="hljs-number">0</span>;
    <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> i = <span class="hljs-number">0</span>; i &lt; <span class="hljs-keyword">this</span>.coords.length; i++) {
      <span class="hljs-keyword">if</span> (<span class="hljs-keyword">this</span>.coords[i][<span class="hljs-number">0</span>] &gt;= x) {
        startX = i;
        <span class="hljs-keyword">break</span>;
      }
    }
    <span class="hljs-keyword">const</span> axis1 = <span class="hljs-keyword">this</span>.coords[startX];
    <span class="hljs-keyword">const</span> axis2 = <span class="hljs-keyword">this</span>.coords[startX - <span class="hljs-number">1</span>];
    <span class="hljs-keyword">const</span> k = (axis2[<span class="hljs-number">1</span>] - axis1[<span class="hljs-number">1</span>]) / (axis2[<span class="hljs-number">0</span>] - axis1[<span class="hljs-number">0</span>]);
    <span class="hljs-keyword">const</span> b = axis1[<span class="hljs-number">1</span>] - k * axis1[<span class="hljs-number">0</span>];
    <span class="hljs-comment">// 结果也只保留三位有效数字</span>
    <span class="hljs-keyword">return</span> <span class="hljs-built_in">parseFloat</span>((k * x + b).toFixed(<span class="hljs-number">3</span>));
  }
}
<span class="copy-code-btn">复制代码</span></code></pre><p>然后通过下述方式就可以使用我们的<code>CubicBezier</code>了：</p>
<pre><code class="hljs javascript copyable" lang="javascript"><span class="hljs-keyword">const</span> cubicBezier = <span class="hljs-keyword">new</span> CubicBezier(<span class="hljs-number">0.3</span>, <span class="hljs-number">0.1</span>, <span class="hljs-number">0.3</span>, <span class="hljs-number">1</span>);
cubicBezier.getY(<span class="hljs-number">0.1</span>); <span class="hljs-comment">// 0.072</span>
cubicBezier.getY(<span class="hljs-number">0.7</span>); <span class="hljs-comment">// 0.931</span>
<span class="copy-code-btn">复制代码</span></code></pre><blockquote>
<p>我写了一个应用这个<code>CubicBezier</code>构造函数的库<a target="_blank" href="https://github.com/SuperJerryshen/animate-scroll" rel="nofollow noopener noreferrer">Animate-Scroll</a>，有兴趣的可以去看一下源码。</p>
</blockquote>
<p><a name="六、如何用高阶贝塞尔曲线表示低阶贝塞尔曲线？"></a></p>
<h2 class="heading" data-id="heading-10">六、如何用高阶贝塞尔曲线表示低阶贝塞尔曲线？</h2>
<p>一个<img alt="n" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(26)">阶贝塞尔曲线可以通过一个形状完全一致的<img alt="n+1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation">阶贝塞尔曲线表示。那我们该怎么做，才能获取这个<img alt="n+1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation">阶贝塞尔曲线呢？</p>
<blockquote>
<p>由高阶贝塞尔曲线表示低阶贝塞尔曲线的过程，我们称之为<strong>升阶</strong>。</p>
</blockquote>
<p>我们需要用到<img alt="B(t)=(1-t)B(t)+tB(t)" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(40)">这个等式来做升阶。</p>
<ol>
<li>先以二阶升三阶为例，二阶贝塞尔曲线坐标公式为：</li>
</ol>
<figure><img alt="B(t) = (1 - t)^2P_0 + 2t(1 - t)P_1 + t^2P_2" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(41)"></figure>
<blockquote>
<p>将以下等式带入上面这个公式中：</p>
</blockquote>
<figure><img alt="P_0=(1-t)P_0 + tP_0" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(42)"></figure>
<figure><img alt="P_1=(1-t)P_1 + tP_1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(43)"></figure>
<figure><img alt="P_2=(1-t)P_2 + tP_2" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(44)"></figure>
<blockquote>
<p>然后得出以下公式：</p>
</blockquote>
<figure><img alt="B(t) = (1-t)^3P_0 + (1-t)^2tP_0 + 2t(1-t)^2P_1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(45)"></figure>
<figure><img alt="+ 2t^2(1-t)P_1 + t^2(1-t)P_2 + t^3P_2" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(46)"></figure>
<figure><img alt="=(1-t)^3P_0 + 3(1-t)^2t\frac{P_0+2P_1}{3} + 3(1-t)t^2\frac{2P_1+P_2}{3} + t^3P_2" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(47)"></figure>
<blockquote>
<p>根据以上结果可以得出控制点由之前的<img alt="P_0,P_1,P_2" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(48)">变成了<img alt="P_0" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(11)">，<img alt="\frac{P_0+2P_1}{3}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(49)">，<img alt="\frac{2P_1+P_2}{3}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(50)">和<img alt="P_2" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(51)">四个控制点了，从而完成了升阶。</p>
</blockquote>
<ol start="2">
<li>如果对于任意的n值，我们该如何进行升阶呢？(以下为推导过程，没兴趣的同学可以直接跳转至下面👇的公式)</li>
</ol>
<blockquote>
<p>这里需要进行一些推导（这里的推导需要用到<img alt="C_n^{i}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(52)">公式，有兴趣的同学可以自己推导一下），因为：</p>
</blockquote>
<figure><img alt="(1-t)b_{i,n}=\frac{n+1-i}{n+1}b_{i,n+1}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(53)"></figure>
<figure><img alt="tb_{i,n}=\frac{i+1}{n+1}b_{i+1,n+1}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(54)"></figure>
<blockquote>
<p>贝塞尔公式可以表示为：</p>
</blockquote>
<figure><img alt="B(t) = (1-t)\sum_{i=0}^{n}b_{i,n}(t)P_i+t\sum_{i=0}^{n}b_{i,n}(t)P_{i}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(55)"></figure>
<blockquote>
<p>带入上述两个等式，得：</p>
</blockquote>
<figure><img alt="B(t) = \sum_{i=0}^{n}\frac{n+1-i}{n+1}b_{i,n+1}(t)P_i+\sum_{i=0}^{n}\frac{i+1}{n+1}b_{i+1,n+1}P_i \quad--\ (0)" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(56)"></figure>
<blockquote>
<p>因为当<img alt="i=n+1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(57)">时:</p>
</blockquote>
<figure><img alt="\frac{i}{n+1}P_{i-1}=0" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(58)"></figure>
<blockquote>
<p>所以该式可以写成：</p>
</blockquote>
<figure><img alt="\sum_{i=0}^{n}\frac{n+1-i}{n+1}P_i = \sum_{i=0}^{n+1}\frac{n+1-i}{n+1}P_i \quad--\ (1)" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(59)"></figure>
<blockquote>
<p>又因为：</p>
</blockquote>
<figure><img alt="\sum_{i=0}^{n}\frac{i+1}{n+1}P_{i} = \sum_{i=1}^{n+1}\frac{i}{n+1}P_{i-1}" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(60)"></figure>
<blockquote>
<p>当<img alt="i=0" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(61)">时：</p>
</blockquote>
<figure><img alt="\frac{i}{n+1}P_{i-1} = 0" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(62)"></figure>
<blockquote>
<p>所以：</p>
</blockquote>
<figure><img alt="\sum_{i=0}^{n}\frac{i+1}{n+1}P_i=\sum_{i=0}^{n+1}\frac{i}{n+1}P_{i-1} \quad--\ (2)" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(63)"></figure>
<blockquote>
<p>将上述两个等式(1)和(2)代入公式(0)中，最终可以得出下面这个升阶公式：</p>
</blockquote>
<figure><img alt="B(t) = \sum_{i=0}^{n+1}(\frac{i}{n+1}P_{i-1} + \frac{n+1-i}{n+1}P_i)b_{i,n+1}(t)" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(64)"></figure>
<figure><img alt="B(t) = \sum_{i=0}^{n+1}(P_{i}^{&#39;})b_{i,n+1}(t)" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(65)"></figure>
<figure><img alt="式中\ P_{i}^{&#39;} = \frac{i}{n+1}P_{i-1} + \frac{n+1-i}{n+1}P_i，其中i=0,1,...n+1" class="equation" src="./深入理解贝塞尔曲线 - 掘金_files/equation(66)"></figure>
<p>关于贝塞尔曲线基本的内容就差不多讲完了，如果您发现不正确或者有补充的地方，欢迎在评论里指出😊。</p>
<h3 class="heading" data-id="heading-11">参考文献</h3>
<ul>
<li><a target="_blank" href="https://zh.wikipedia.org/wiki/%E8%B2%9D%E8%8C%B2%E6%9B%B2%E7%B7%9A" rel="nofollow noopener noreferrer">贝济埃曲线 - 维基百科，自由的百科全书</a></li>
<li><a target="_blank" href="https://javascript.info/bezier-curve" rel="nofollow noopener noreferrer">Bezier curve - The Modern Javascript Tutorial</a></li>
</ul>
</div></article><div data-v-0b1a4f9a="" data-v-575c8a08="" class="tag-list-box"><div data-v-0b1a4f9a="" data-v-575c8a08="" class="tag-list-title">关注下面的标签，发现更多相似文章</div><div data-v-0b1a4f9a="" data-v-575c8a08="" st:block="tagList" class="tag-list"><a data-v-0b1a4f9a="" href="https://juejin.im/tag/CSS" target="_blank" rel="" st:name="tag" class="item" data-v-575c8a08=""><div data-v-e232e062="" data-v-02a6947c="" data-v-0b1a4f9a="" data-src="https://lc-gold-cdn.xitu.io/66de0c4eb9d10130d5bf.png?imageView2/2/w/42/h/42/q/85/format/webp/interlace/1" class="lazy thumb tag-icon loaded" style="background-image: url(&quot;https://lc-gold-cdn.xitu.io/66de0c4eb9d10130d5bf.png?imageView2/2/w/42/h/42/q/85/format/webp/interlace/1&quot;); background-size: contain;"></div><div data-v-0b1a4f9a="" class="tag-title">CSS</div></a><a data-v-0b1a4f9a="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" class="item" data-v-575c8a08=""><div data-v-e232e062="" data-v-02a6947c="" data-v-0b1a4f9a="" data-src="https://lc-gold-cdn.xitu.io/bac28828a49181c34110.png?imageView2/2/w/42/h/42/q/85/format/webp/interlace/1" class="lazy thumb tag-icon loaded" style="background-image: url(&quot;https://lc-gold-cdn.xitu.io/bac28828a49181c34110.png?imageView2/2/w/42/h/42/q/85/format/webp/interlace/1&quot;); background-size: contain;"></div><div data-v-0b1a4f9a="" class="tag-title">前端</div></a><a data-v-0b1a4f9a="" href="https://juejin.im/tag/%E5%9B%BE%E5%BD%A2%E5%AD%A6" target="_blank" rel="" st:name="tag" class="item" data-v-575c8a08=""><div data-v-e232e062="" data-v-02a6947c="" data-v-0b1a4f9a="" data-src="https://lc-gold-cdn.xitu.io/01376729ef53b305ff68.jpg?imageView2/2/w/42/h/42/q/85/format/webp/interlace/1" class="lazy thumb tag-icon loaded" style="background-image: url(&quot;https://lc-gold-cdn.xitu.io/01376729ef53b305ff68.jpg?imageView2/2/w/42/h/42/q/85/format/webp/interlace/1&quot;); background-size: contain;"></div><div data-v-0b1a4f9a="" class="tag-title">图形学</div></a></div></div><a data-v-0b1a4f9a="" href="https://juejin.im/user/57de657179bc440065e34999" target="_blank" rel="" data-v-575c8a08=""><div data-v-0b1a4f9a="" class="footer-author-block"><div data-v-7bb2fea5="" data-v-0b1a4f9a="" itemscope="itemscope" itemtype="http://schema.org/Person" class="author"><meta itemprop="url" content="https://juejin.im/user/57de657179bc440065e34999"><meta itemprop="image" content="https://user-gold-cdn.xitu.io/2016/11/30/cf6efcedc766022278fc65bc2daa8dd2"><meta itemprop="name" content="与我常在Jerry"><meta itemprop="jobTitle" content="Web前端工程师"><div itemprop="memberOf" itemscope="itemscope" itemtype="http://schema.org/Organization"><meta itemprop="name" content="Rockontrol"></div><div data-v-7bb2fea5="" class="author-info-block"><a data-v-7bb2fea5="" href="https://juejin.im/user/57de657179bc440065e34999" target="_blank" rel="" class="avatar-link"><div data-v-e232e062="" data-v-4bc4293a="" data-v-7bb2fea5="" data-src="https://user-gold-cdn.xitu.io/2016/11/30/cf6efcedc766022278fc65bc2daa8dd2?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2016/11/30/cf6efcedc766022278fc65bc2daa8dd2?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div></a><div data-v-7bb2fea5="" class="author-info-box"><div data-v-7bb2fea5="" class="profile-box"><a data-v-b8de4708="" data-v-7bb2fea5="" href="https://juejin.im/user/57de657179bc440065e34999" target="_blank" rel="" class="username username ellipsis">与我常在Jerry<a data-v-b9e98e56="" data-v-b8de4708="" href="https://juejin.im/book/5c90640c5188252d7941f5bb/section/5c9065385188252da6320022" target="_blank" rel="" class="rank"><img data-v-b9e98e56="" src="./深入理解贝塞尔曲线 - 掘金_files/lv-2.f597b88.svg" alt="lv-2"></a></a><span data-v-7bb2fea5="" class="position ellipsis">Web前端工程师 @ Rockontrol</span></div><div data-v-7bb2fea5="" class="meta-box"><a data-v-7bb2fea5="" href="https://juejin.im/user/57de657179bc440065e34999/posts" target="_blank" rel="" class="posts"><span data-v-7bb2fea5="" class="count post-count">发布了 5 篇专栏 · </span></a><span data-v-7bb2fea5="" class="count">获得点赞 515 · </span><span data-v-7bb2fea5="" class="count">获得阅读 18,491</span></div></div><button data-v-1de19339="" data-v-7bb2fea5="" class="follow-button follow">关注</button></div></div></div></a><div data-v-0b1a4f9a="" data-v-575c8a08="" st:block="banner" class="article-banner"><a data-v-0b1a4f9a="" data-v-575c8a08="" st:name="link" st:state="https://juejin.im/extension/?utm_source=juejin.im&amp;utm_medium=post&amp;utm_campaign=extension_promotion" class="banner-title" href="https://juejin.im/extension/?utm_source=juejin.im&amp;utm_medium=post&amp;utm_campaign=extension_promotion" target="_blank">安装掘金浏览器插件</a><div data-v-0b1a4f9a="" data-v-575c8a08="" class="banner-content">打开新标签页发现好内容，掘金、GitHub、Dribbble、ProductHunt 等站点内容轻松获取。快来安装掘金浏览器插件获取高质量内容吧！</div></div><!----><!----><div data-v-155e8a6c="" data-v-0b1a4f9a="" class="comment-list-box" id="comment-box" data-v-575c8a08="" manual="true"><div data-v-155e8a6c="" class="title">评论</div><div data-v-2761ac2b="" data-v-155e8a6c="" class="comment-form comment-form"><div data-v-2761ac2b="" class="avatar-box"><div data-v-e232e062="" data-v-4bc4293a="" data-v-2761ac2b="" data-src="https://mirror-gold-cdn.xitu.io/168e095e4f3a31aee1a?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://mirror-gold-cdn.xitu.io/168e095e4f3a31aee1a?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div></div><div data-v-2761ac2b="" class="form-box"><div data-v-2761ac2b="" class="input-box"><div data-v-171c4b3f="" data-v-2761ac2b="" class="auth-card"><!----><div data-v-2761ac2b="" data-v-171c4b3f="" contenteditable="true" spellcheck="false" placeholder="输入评论..." class="rich-input empty"><br data-v-2761ac2b="" data-v-171c4b3f=""></div></div><!----></div><!----></div><input data-v-2761ac2b="" type="file" class="hidden"></div><div data-v-4750593f="" data-v-155e8a6c="" class="comment-list comment-list"><div data-v-fa31c83e="" data-v-4750593f="" class="image-viewer-box"><!----></div><div data-v-4750593f="" class="item"><div data-v-d4ef8f8c="" data-v-4750593f="" class="comment comment"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5ee1af5bf265da76f6532405" class="user-popover-box popover"><!----><a data-v-d4ef8f8c="" href="https://juejin.im/user/5ee1af5bf265da76f6532405" target="_blank" rel="" class="user-link" data-v-1d890915=""><div data-v-e232e062="" data-v-4bc4293a="" data-v-d4ef8f8c="" data-src="https://b-gold-cdn.xitu.io/v3/static/img/default-avatar.e30559a.svg" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://b-gold-cdn.xitu.io/v3/static/img/default-avatar.e30559a.svg&quot;);"></div></a></div><div data-v-d4ef8f8c="" class="content-box comment-divider-line"><div data-v-d4ef8f8c="" class="meta-box"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5ee1af5bf265da76f6532405" class="user-popover-box"><!----><a data-v-b8de4708="" data-v-d4ef8f8c="" href="https://juejin.im/user/5ee1af5bf265da76f6532405" target="_blank" rel="" class="username username ellipsis" data-v-1d890915="">find_shell<!----></a></div><div data-v-d4ef8f8c="" class="position"></div></div><div data-v-d4ef8f8c="" class="content">高手啊，讲的真心不错呀；受教了；</div><div data-v-d4ef8f8c="" class="limit-ctl-box"><!----><!----></div><!----><div data-v-d4ef8f8c="" class="reply-stat"><time data-v-d4ef8f8c="" datetime="2020-06-11T04:13:52.676Z" title="Thu Jun 11 2020 12:13:52 GMT+0800 (香港标准时间)" class="time">8天前</time><div data-v-d4ef8f8c="" class="delete"> &nbsp;·&nbsp;删除</div><div data-v-d4ef8f8c="" class="action-box"><div data-v-d4ef8f8c="" class="like-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon like-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M4.58 8.25V17h-1.4C2.53 17 2 16.382 2 15.624V9.735c0-.79.552-1.485 1.18-1.485h1.4zM11.322 2c1.011.019 1.614.833 1.823 1.235.382.735.392 1.946.13 2.724-.236.704-.785 1.629-.785 1.629h4.11c.434 0 .838.206 1.107.563.273.365.363.84.24 1.272l-1.86 6.513A1.425 1.425 0 0 1 14.724 17H6.645V7.898C8.502 7.51 9.643 4.59 9.852 3.249A1.47 1.47 0 0 1 11.322 2z"></path></g></svg><!----></div><div data-v-d4ef8f8c="" class="comment-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon comment-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M10 17c-4.142 0-7.5-2.91-7.5-6.5S5.858 4 10 4c4.142 0 7.5 2.91 7.5 6.5 0 1.416-.522 2.726-1.41 3.794-.129.156.41 3.206.41 3.206l-3.265-1.134c-.998.369-2.077.634-3.235.634z"></path></g></svg> <span data-v-d4ef8f8c="" class="action-title">回复</span></div></div></div><!----><div data-v-1433d878="" data-v-d4ef8f8c="" class="sub-comment-list sub-comment-list"><div data-v-1433d878="" class="item"><div data-v-4753cf06="" data-v-1433d878="" class="sub-comment sub-comment"><div data-v-4753cf06="" class="sub-comment-content-row"><div data-v-4753cf06="" class="sub-comment-content-box"><div data-v-1d890915="" data-v-4753cf06="" st:block="userPopover" st:state="57de657179bc440065e34999" class="user-popover-box popover"><!----><a data-v-4753cf06="" href="https://juejin.im/user/57de657179bc440065e34999" target="_blank" rel="" class="username" data-v-1d890915=""><div data-v-e232e062="" data-v-4bc4293a="" data-v-4753cf06="" data-src="https://user-gold-cdn.xitu.io/2016/11/30/cf6efcedc766022278fc65bc2daa8dd2?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2016/11/30/cf6efcedc766022278fc65bc2daa8dd2?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div></a></div><div data-v-4753cf06="" class="user-content-box"><div data-v-4753cf06="" class="profie"><div data-v-1d890915="" data-v-4753cf06="" st:block="userPopover" st:state="57de657179bc440065e34999" class="user-popover-box"><!----><a data-v-b8de4708="" data-v-4753cf06="" href="https://juejin.im/user/57de657179bc440065e34999" target="_blank" rel="" class="username" data-v-1d890915="">与我常在Jerry<a data-v-b9e98e56="" data-v-b8de4708="" href="https://juejin.im/book/5c90640c5188252d7941f5bb/section/5c9065385188252da6320022" target="_blank" rel="" class="rank"><img data-v-b9e98e56="" src="./深入理解贝塞尔曲线 - 掘金_files/lv-2.f597b88.svg" alt="lv-2"></a><span data-v-4753cf06="" class="author-badge-text">(作者)</span></a></div><div data-v-4753cf06="" class="position">Web前端工程师 @ Rockontrol</div></div><div data-v-4753cf06="" class="content-box"><span data-v-4753cf06=""> 回复 </span><div data-v-1d890915="" data-v-4753cf06="" st:block="userPopover" st:state="5ee1af5bf265da76f6532405" class="user-popover-box"><!----><a data-v-b8de4708="" data-v-4753cf06="" href="https://juejin.im/user/5ee1af5bf265da76f6532405" target="_blank" rel="" class="username username be-replied" data-v-1d890915="">find_shell<!----></a></div><!----><span data-v-4753cf06="">: </span><span data-v-4753cf06="" class="content">有兴趣可以再去看看我写的[深入理解B样条曲线](<a href="https://juejin.im/post/5ecbb0716fb9a0480659db4a" class="parse-emoji-url" style="color: #027fff" title="https://juejin.im/post/5ecbb0716fb9a0480659db4a" target="_blank" rel="nofollow noopener noreferrer"><img alt="https://juejin.im/post/5ecbb0716fb9a0480659db4a" style="vertical-align: sub" draggable="false" src="./深入理解贝塞尔曲线 - 掘金_files/pin-url-link.3f843e8.svg">juejin.im/post/5ecbb0716...</a>)<img class="emoji" draggable="false" alt="😉" src="./深入理解贝塞尔曲线 - 掘金_files/1f609.svg"></span></div><!----><!----><div data-v-4753cf06="" class="limit-all-box"><!----></div><div data-v-4753cf06="" class="sub-comment-stat-box"><time data-v-4753cf06="" datetime="2020-06-11T06:56:41.116Z" title="Thu Jun 11 2020 14:56:41 GMT+0800 (香港标准时间)" class="time">8天前</time><div data-v-4753cf06="" class="delete"> &nbsp;·&nbsp;删除</div><div data-v-4753cf06="" class="sub-comment-action-box"><div data-v-4753cf06="" class="like-action action"><svg data-v-4753cf06="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon like-icon"><g data-v-4753cf06="" fill="none" fill-rule="evenodd"><path data-v-4753cf06="" d="M0 0h20v20H0z"></path> <path data-v-4753cf06="" stroke="#8A93A0" stroke-linejoin="round" d="M4.58 8.25V17h-1.4C2.53 17 2 16.382 2 15.624V9.735c0-.79.552-1.485 1.18-1.485h1.4zM11.322 2c1.011.019 1.614.833 1.823 1.235.382.735.392 1.946.13 2.724-.236.704-.785 1.629-.785 1.629h4.11c.434 0 .838.206 1.107.563.273.365.363.84.24 1.272l-1.86 6.513A1.425 1.425 0 0 1 14.724 17H6.645V7.898C8.502 7.51 9.643 4.59 9.852 3.249A1.47 1.47 0 0 1 11.322 2z"></path></g></svg><!----></div><div data-v-4753cf06="" class="comment-action action"><svg data-v-4753cf06="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon comment-icon"><g data-v-4753cf06="" fill="none" fill-rule="evenodd"><path data-v-4753cf06="" d="M0 0h20v20H0z"></path> <path data-v-4753cf06="" stroke="#8A93A0" stroke-linejoin="round" d="M10 17c-4.142 0-7.5-2.91-7.5-6.5S5.858 4 10 4c4.142 0 7.5 2.91 7.5 6.5 0 1.416-.522 2.726-1.41 3.794-.129.156.41 3.206.41 3.206l-3.265-1.134c-.998.369-2.077.634-3.235.634z"></path></g></svg> <span data-v-4753cf06="">回复</span></div></div></div><!----></div></div></div><!----></div></div><!----></div></div><!----></div></div><div data-v-4750593f="" class="item"><div data-v-d4ef8f8c="" data-v-4750593f="" class="comment comment"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5e4425d6f265da5729788072" class="user-popover-box popover"><!----><a data-v-d4ef8f8c="" href="https://juejin.im/user/5e4425d6f265da5729788072" target="_blank" rel="" class="user-link" data-v-1d890915=""><div data-v-e232e062="" data-v-4bc4293a="" data-v-d4ef8f8c="" data-src="https://b-gold-cdn.xitu.io/v3/static/img/default-avatar.e30559a.svg" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://b-gold-cdn.xitu.io/v3/static/img/default-avatar.e30559a.svg&quot;);"></div></a></div><div data-v-d4ef8f8c="" class="content-box comment-divider-line"><div data-v-d4ef8f8c="" class="meta-box"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5e4425d6f265da5729788072" class="user-popover-box"><!----><a data-v-b8de4708="" data-v-d4ef8f8c="" href="https://juejin.im/user/5e4425d6f265da5729788072" target="_blank" rel="" class="username username ellipsis" data-v-1d890915="">我真的叫张小春<a data-v-b9e98e56="" data-v-b8de4708="" href="https://juejin.im/book/5c90640c5188252d7941f5bb/section/5c9065385188252da6320022" target="_blank" rel="" class="rank"><img data-v-b9e98e56="" src="./深入理解贝塞尔曲线 - 掘金_files/lv-1.636691c.svg" alt="lv-1"></a></a></div><div data-v-d4ef8f8c="" class="position"></div></div><div data-v-d4ef8f8c="" class="content">学习canvas时遇到贝塞尔曲线，生硬的记下了接口，总不能理解，这次乘着复习的间隙，算是搞懂了。谢谢。</div><div data-v-d4ef8f8c="" class="limit-ctl-box"><!----><!----></div><!----><div data-v-d4ef8f8c="" class="reply-stat"><time data-v-d4ef8f8c="" datetime="2020-03-03T01:53:28.099Z" title="Tue Mar 03 2020 09:53:28 GMT+0800 (香港标准时间)" class="time">3月前</time><div data-v-d4ef8f8c="" class="delete"> &nbsp;·&nbsp;删除</div><div data-v-d4ef8f8c="" class="action-box"><div data-v-d4ef8f8c="" class="like-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon like-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M4.58 8.25V17h-1.4C2.53 17 2 16.382 2 15.624V9.735c0-.79.552-1.485 1.18-1.485h1.4zM11.322 2c1.011.019 1.614.833 1.823 1.235.382.735.392 1.946.13 2.724-.236.704-.785 1.629-.785 1.629h4.11c.434 0 .838.206 1.107.563.273.365.363.84.24 1.272l-1.86 6.513A1.425 1.425 0 0 1 14.724 17H6.645V7.898C8.502 7.51 9.643 4.59 9.852 3.249A1.47 1.47 0 0 1 11.322 2z"></path></g></svg><!----></div><div data-v-d4ef8f8c="" class="comment-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon comment-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M10 17c-4.142 0-7.5-2.91-7.5-6.5S5.858 4 10 4c4.142 0 7.5 2.91 7.5 6.5 0 1.416-.522 2.726-1.41 3.794-.129.156.41 3.206.41 3.206l-3.265-1.134c-.998.369-2.077.634-3.235.634z"></path></g></svg> <span data-v-d4ef8f8c="" class="action-title">回复</span></div></div></div><!----><div data-v-1433d878="" data-v-d4ef8f8c="" class="sub-comment-list sub-comment-list"><!----></div></div><!----></div></div><div data-v-4750593f="" class="item"><div data-v-d4ef8f8c="" data-v-4750593f="" class="comment comment"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5da9c88b6fb9a04e35598402" class="user-popover-box popover"><!----><a data-v-d4ef8f8c="" href="https://juejin.im/user/5da9c88b6fb9a04e35598402" target="_blank" rel="" class="user-link" data-v-1d890915=""><div data-v-e232e062="" data-v-4bc4293a="" data-v-d4ef8f8c="" data-src="https://mirror-gold-cdn.xitu.io/16ddf3766983caac2fc?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://mirror-gold-cdn.xitu.io/16ddf3766983caac2fc?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div></a></div><div data-v-d4ef8f8c="" class="content-box comment-divider-line"><div data-v-d4ef8f8c="" class="meta-box"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5da9c88b6fb9a04e35598402" class="user-popover-box"><!----><a data-v-b8de4708="" data-v-d4ef8f8c="" href="https://juejin.im/user/5da9c88b6fb9a04e35598402" target="_blank" rel="" class="username username ellipsis" data-v-1d890915="">溶酶菌。<!----></a></div><div data-v-d4ef8f8c="" class="position">全栈工程师</div></div><div data-v-d4ef8f8c="" class="content">不错不错，刚好写前端要用，基本看懂了</div><div data-v-d4ef8f8c="" class="limit-ctl-box"><!----><!----></div><!----><div data-v-d4ef8f8c="" class="reply-stat"><time data-v-d4ef8f8c="" datetime="2020-01-08T18:37:36.578Z" title="Thu Jan 09 2020 02:37:36 GMT+0800 (香港标准时间)" class="time">5月前</time><div data-v-d4ef8f8c="" class="delete"> &nbsp;·&nbsp;删除</div><div data-v-d4ef8f8c="" class="action-box"><div data-v-d4ef8f8c="" class="like-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon like-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M4.58 8.25V17h-1.4C2.53 17 2 16.382 2 15.624V9.735c0-.79.552-1.485 1.18-1.485h1.4zM11.322 2c1.011.019 1.614.833 1.823 1.235.382.735.392 1.946.13 2.724-.236.704-.785 1.629-.785 1.629h4.11c.434 0 .838.206 1.107.563.273.365.363.84.24 1.272l-1.86 6.513A1.425 1.425 0 0 1 14.724 17H6.645V7.898C8.502 7.51 9.643 4.59 9.852 3.249A1.47 1.47 0 0 1 11.322 2z"></path></g></svg><!----></div><div data-v-d4ef8f8c="" class="comment-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon comment-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M10 17c-4.142 0-7.5-2.91-7.5-6.5S5.858 4 10 4c4.142 0 7.5 2.91 7.5 6.5 0 1.416-.522 2.726-1.41 3.794-.129.156.41 3.206.41 3.206l-3.265-1.134c-.998.369-2.077.634-3.235.634z"></path></g></svg> <span data-v-d4ef8f8c="" class="action-title">回复</span></div></div></div><!----><div data-v-1433d878="" data-v-d4ef8f8c="" class="sub-comment-list sub-comment-list"><!----></div></div><!----></div></div><div data-v-4750593f="" class="item"><div data-v-d4ef8f8c="" data-v-4750593f="" class="comment comment"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="595af9e86fb9a06ba317cc66" class="user-popover-box popover"><!----><a data-v-d4ef8f8c="" href="https://juejin.im/user/595af9e86fb9a06ba317cc66" target="_blank" rel="" class="user-link" data-v-1d890915=""><div data-v-e232e062="" data-v-4bc4293a="" data-v-d4ef8f8c="" data-src="https://user-gold-cdn.xitu.io/2020/2/29/1708ee1ae5c9b0b6?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2020/2/29/1708ee1ae5c9b0b6?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div></a></div><div data-v-d4ef8f8c="" class="content-box comment-divider-line"><div data-v-d4ef8f8c="" class="meta-box"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="595af9e86fb9a06ba317cc66" class="user-popover-box"><!----><a data-v-b8de4708="" data-v-d4ef8f8c="" href="https://juejin.im/user/595af9e86fb9a06ba317cc66" target="_blank" rel="" class="username username ellipsis" data-v-1d890915="">Blazer<!----></a></div><div data-v-d4ef8f8c="" class="position">Android开发</div></div><div data-v-d4ef8f8c="" class="content"><img class="emoji" draggable="false" alt="👏" src="./深入理解贝塞尔曲线 - 掘金_files/1f44f.svg"></div><div data-v-d4ef8f8c="" class="limit-ctl-box"><!----><!----></div><!----><div data-v-d4ef8f8c="" class="reply-stat"><time data-v-d4ef8f8c="" datetime="2019-04-22T08:46:21.385Z" title="Mon Apr 22 2019 16:46:21 GMT+0800 (香港标准时间)" class="time">1年前</time><div data-v-d4ef8f8c="" class="delete"> &nbsp;·&nbsp;删除</div><div data-v-d4ef8f8c="" class="action-box"><div data-v-d4ef8f8c="" class="like-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon like-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M4.58 8.25V17h-1.4C2.53 17 2 16.382 2 15.624V9.735c0-.79.552-1.485 1.18-1.485h1.4zM11.322 2c1.011.019 1.614.833 1.823 1.235.382.735.392 1.946.13 2.724-.236.704-.785 1.629-.785 1.629h4.11c.434 0 .838.206 1.107.563.273.365.363.84.24 1.272l-1.86 6.513A1.425 1.425 0 0 1 14.724 17H6.645V7.898C8.502 7.51 9.643 4.59 9.852 3.249A1.47 1.47 0 0 1 11.322 2z"></path></g></svg><!----></div><div data-v-d4ef8f8c="" class="comment-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon comment-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M10 17c-4.142 0-7.5-2.91-7.5-6.5S5.858 4 10 4c4.142 0 7.5 2.91 7.5 6.5 0 1.416-.522 2.726-1.41 3.794-.129.156.41 3.206.41 3.206l-3.265-1.134c-.998.369-2.077.634-3.235.634z"></path></g></svg> <span data-v-d4ef8f8c="" class="action-title">回复</span></div></div></div><!----><div data-v-1433d878="" data-v-d4ef8f8c="" class="sub-comment-list sub-comment-list"><!----></div></div><!----></div></div><div data-v-4750593f="" class="item"><div data-v-d4ef8f8c="" data-v-4750593f="" class="comment comment"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5965c0916fb9a06bb61ffc58" class="user-popover-box popover"><!----><a data-v-d4ef8f8c="" href="https://juejin.im/user/5965c0916fb9a06bb61ffc58" target="_blank" rel="" class="user-link" data-v-1d890915=""><div data-v-e232e062="" data-v-4bc4293a="" data-v-d4ef8f8c="" data-src="https://user-gold-cdn.xitu.io/2019/3/29/169c8b648c042556?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2019/3/29/169c8b648c042556?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div></a></div><div data-v-d4ef8f8c="" class="content-box comment-divider-line"><div data-v-d4ef8f8c="" class="meta-box"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5965c0916fb9a06bb61ffc58" class="user-popover-box"><!----><a data-v-b8de4708="" data-v-d4ef8f8c="" href="https://juejin.im/user/5965c0916fb9a06bb61ffc58" target="_blank" rel="" class="username username ellipsis" data-v-1d890915="">不会撩妹的楚留香<a data-v-b9e98e56="" data-v-b8de4708="" href="https://juejin.im/book/5c90640c5188252d7941f5bb/section/5c9065385188252da6320022" target="_blank" rel="" class="rank"><img data-v-b9e98e56="" src="./深入理解贝塞尔曲线 - 掘金_files/lv-1.636691c.svg" alt="lv-1"></a></a></div><div data-v-d4ef8f8c="" class="position">前前前前前前前前前前前前前前前前前前前前 @ 天上人间</div></div><div data-v-d4ef8f8c="" class="content">还好没有点进来</div><div data-v-d4ef8f8c="" class="limit-ctl-box"><!----><!----></div><!----><div data-v-d4ef8f8c="" class="reply-stat"><time data-v-d4ef8f8c="" datetime="2018-09-02T13:50:59.374Z" title="Sun Sep 02 2018 21:50:59 GMT+0800 (香港标准时间)" class="time">1年前</time><div data-v-d4ef8f8c="" class="delete"> &nbsp;·&nbsp;删除</div><div data-v-d4ef8f8c="" class="action-box"><div data-v-d4ef8f8c="" class="like-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon like-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M4.58 8.25V17h-1.4C2.53 17 2 16.382 2 15.624V9.735c0-.79.552-1.485 1.18-1.485h1.4zM11.322 2c1.011.019 1.614.833 1.823 1.235.382.735.392 1.946.13 2.724-.236.704-.785 1.629-.785 1.629h4.11c.434 0 .838.206 1.107.563.273.365.363.84.24 1.272l-1.86 6.513A1.425 1.425 0 0 1 14.724 17H6.645V7.898C8.502 7.51 9.643 4.59 9.852 3.249A1.47 1.47 0 0 1 11.322 2z"></path></g></svg><!----></div><div data-v-d4ef8f8c="" class="comment-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon comment-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M10 17c-4.142 0-7.5-2.91-7.5-6.5S5.858 4 10 4c4.142 0 7.5 2.91 7.5 6.5 0 1.416-.522 2.726-1.41 3.794-.129.156.41 3.206.41 3.206l-3.265-1.134c-.998.369-2.077.634-3.235.634z"></path></g></svg> <span data-v-d4ef8f8c="" class="action-title">回复</span></div></div></div><!----><div data-v-1433d878="" data-v-d4ef8f8c="" class="sub-comment-list sub-comment-list"><!----></div></div><!----></div></div><div data-v-4750593f="" class="item"><div data-v-d4ef8f8c="" data-v-4750593f="" class="comment comment"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5b854a136fb9a01a0c0fef7b" class="user-popover-box popover"><!----><a data-v-d4ef8f8c="" href="https://juejin.im/user/5b854a136fb9a01a0c0fef7b" target="_blank" rel="" class="user-link" data-v-1d890915=""><div data-v-e232e062="" data-v-4bc4293a="" data-v-d4ef8f8c="" data-src="https://mirror-gold-cdn.xitu.io/168e093aa66c04e3b9a?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://mirror-gold-cdn.xitu.io/168e093aa66c04e3b9a?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div></a></div><div data-v-d4ef8f8c="" class="content-box comment-divider-line"><div data-v-d4ef8f8c="" class="meta-box"><div data-v-1d890915="" data-v-d4ef8f8c="" st:block="userPopover" st:state="5b854a136fb9a01a0c0fef7b" class="user-popover-box"><!----><a data-v-b8de4708="" data-v-d4ef8f8c="" href="https://juejin.im/user/5b854a136fb9a01a0c0fef7b" target="_blank" rel="" class="username username ellipsis" data-v-1d890915="">chunbobo<!----></a></div><div data-v-d4ef8f8c="" class="position"></div></div><div data-v-d4ef8f8c="" class="content">都是汉字和数字，放一起就不认识了</div><div data-v-d4ef8f8c="" class="limit-ctl-box"><!----><!----></div><!----><div data-v-d4ef8f8c="" class="reply-stat"><time data-v-d4ef8f8c="" datetime="2018-08-31T07:24:46.235Z" title="Fri Aug 31 2018 15:24:46 GMT+0800 (香港标准时间)" class="time">1年前</time><div data-v-d4ef8f8c="" class="delete"> &nbsp;·&nbsp;删除</div><div data-v-d4ef8f8c="" class="action-box"><div data-v-d4ef8f8c="" class="like-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon like-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M4.58 8.25V17h-1.4C2.53 17 2 16.382 2 15.624V9.735c0-.79.552-1.485 1.18-1.485h1.4zM11.322 2c1.011.019 1.614.833 1.823 1.235.382.735.392 1.946.13 2.724-.236.704-.785 1.629-.785 1.629h4.11c.434 0 .838.206 1.107.563.273.365.363.84.24 1.272l-1.86 6.513A1.425 1.425 0 0 1 14.724 17H6.645V7.898C8.502 7.51 9.643 4.59 9.852 3.249A1.47 1.47 0 0 1 11.322 2z"></path></g></svg><span data-v-d4ef8f8c="" class="action-title">3</span></div><div data-v-d4ef8f8c="" class="comment-action action"><svg data-v-d4ef8f8c="" aria-hidden="true" width="16" height="16" viewBox="0 0 20 20" class="icon comment-icon"><g data-v-d4ef8f8c="" fill="none" fill-rule="evenodd"><path data-v-d4ef8f8c="" d="M0 0h20v20H0z"></path> <path data-v-d4ef8f8c="" stroke="#8A93A0" stroke-linejoin="round" d="M10 17c-4.142 0-7.5-2.91-7.5-6.5S5.858 4 10 4c4.142 0 7.5 2.91 7.5 6.5 0 1.416-.522 2.726-1.41 3.794-.129.156.41 3.206.41 3.206l-3.265-1.134c-.998.369-2.077.634-3.235.634z"></path></g></svg> <span data-v-d4ef8f8c="" class="action-title">回复</span></div></div></div><!----><div data-v-1433d878="" data-v-d4ef8f8c="" class="sub-comment-list sub-comment-list"><!----></div></div><!----></div></div></div><div data-v-155e8a6c="" class="fetch-more-comment">查看更多 &gt;</div></div></div><!----><div data-v-0b1a4f9a="" data-v-575c8a08="" st:block="recommended" class="main-area recommended-area shadow"><div data-v-0b1a4f9a="" data-v-575c8a08="" class="recommended-entry-list-title">相关推荐</div><!----><ul data-v-687302b1="" data-v-0b1a4f9a="" st:block="entryList" class="entry-list recommended-entry-list" data-v-575c8a08=""><!----><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5eec2890e51d45740d1cde29|1" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eec270ce51d4574220aa67d" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="5d415daae51d4561c273a650" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/5d415daae51d4561c273a650" target="_blank" rel="" st:name="user" st:state="5d415daae51d4561c273a650" data-v-1d890915="">WecTeam</a></div></li><li data-v-ccfa68c6="" class="item">4小时前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5eec270ce51d4574220aa67d" target="_blank" rel="" st:name="title" class="title">你知道自己的代码在线上有多少问题吗</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">30</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eec270ce51d4574220aa67d#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><span data-v-ccfa68c6="" class="count">1</span></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><!----></div></a></div></div></li><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5eec0acaf265da02e9295d92|2" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eec09b9f265da02bb1ebf64" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="5790c76dc4c9710054f0f58b" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/5790c76dc4c9710054f0f58b" target="_blank" rel="" st:name="user" st:state="5790c76dc4c9710054f0f58b" data-v-1d890915="">前端早早聊</a></div></li><li data-v-ccfa68c6="" class="item">6小时前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6" target="_blank" rel="" st:name="tag" st:state="55978433e4b0c4d3e6fddcb1" class="tag">前端框架</a><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5eec09b9f265da02bb1ebf64" target="_blank" rel="" st:name="title" class="title">微前端连载 1：如何落地微前端一体化运营工作台</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">34</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eec09b9f265da02bb1ebf64#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><span data-v-ccfa68c6="" class="count">5</span></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><div data-v-e232e062="" data-v-02a6947c="" data-v-ccfa68c6="" data-src="https://user-gold-cdn.xitu.io/2020/6/19/172ca09ae01d451f?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1" class="lazy thumb thumb loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2020/6/19/172ca09ae01d451f?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1&quot;); background-size: cover;"></div></div></a></div></div></li><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5eeb5e936fb9a058753583cf|3" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeae4f7e51d4574195ed982" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="5c18f6216fb9a049f36209fd" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/5c18f6216fb9a049f36209fd" target="_blank" rel="" st:name="user" st:state="5c18f6216fb9a049f36209fd" data-v-1d890915="">炽翎</a></div></li><li data-v-ccfa68c6="" class="item">18小时前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeae4f7e51d4574195ed982" target="_blank" rel="" st:name="title" class="title">不想痛失薪资普调和年终奖？试试自动化测试！（基础篇）</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">118</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeae4f7e51d4574195ed982#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><span data-v-ccfa68c6="" class="count">20</span></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><!----></div></a></div></div></li><!----><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5ee97230e51d45789f23fd79|4" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee8c60ef265da76ed486e20" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="5c6256596fb9a049bd42c770" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/5c6256596fb9a049bd42c770" target="_blank" rel="" st:name="user" st:state="5c6256596fb9a049bd42c770" data-v-1d890915="">刘小夕</a></div></li><li data-v-ccfa68c6="" class="item">2天前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/JavaScript" target="_blank" rel="" st:name="tag" st:state="55964d83e4b08a686cc6b353" class="tag">JavaScript</a><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee8c60ef265da76ed486e20" target="_blank" rel="" st:name="title" class="title">10个打开了我新世界大门的 WebAPI</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">449</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee8c60ef265da76ed486e20#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><span data-v-ccfa68c6="" class="count">35</span></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><div data-v-e232e062="" data-v-02a6947c="" data-v-ccfa68c6="" data-src="https://user-gold-cdn.xitu.io/2020/6/16/172bd4e5f42bdb65?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1" class="lazy thumb thumb loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2020/6/16/172bd4e5f42bdb65?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1&quot;); background-size: cover;"></div></div></a></div></div></li><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5eeabb70e51d4573f45c3a67|5" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeab9d051882565c0796312" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="5790c76dc4c9710054f0f58b" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/5790c76dc4c9710054f0f58b" target="_blank" rel="" st:name="user" st:state="5790c76dc4c9710054f0f58b" data-v-1d890915="">前端早早聊</a></div></li><li data-v-ccfa68c6="" class="item">1天前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E9%9D%A2%E8%AF%95" target="_blank" rel="" st:name="tag" st:state="55979fe6e4b08a686ce562fe" class="tag">面试</a><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeab9d051882565c0796312" target="_blank" rel="" st:name="title" class="title">进大厂连载 3/15：如何借助 5 道算法题入职 Leetcode</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">58</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeab9d051882565c0796312#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><span data-v-ccfa68c6="" class="count">3</span></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><div data-v-e232e062="" data-v-02a6947c="" data-v-ccfa68c6="" data-src="https://user-gold-cdn.xitu.io/2020/6/18/172c4ebdb737001a?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1" class="lazy thumb thumb loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2020/6/18/172c4ebdb737001a?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1&quot;); background-size: cover;"></div></div></a></div></div></li><!----><!----><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5ee879cdf265da77084794eb|4" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee83f10e51d4578975a7b8a" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="58cc0d9b44d9040069fab44f" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/58cc0d9b44d9040069fab44f" target="_blank" rel="" st:name="user" st:state="58cc0d9b44d9040069fab44f" data-v-1d890915="">阿宝哥</a></div></li><li data-v-ccfa68c6="" class="item">2天前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/JavaScript" target="_blank" rel="" st:name="tag" st:state="55964d83e4b08a686cc6b353" class="tag">JavaScript</a><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee83f10e51d4578975a7b8a" target="_blank" rel="" st:name="title" class="title">前端存储除了 localStorage 还有啥</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">305</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee83f10e51d4578975a7b8a#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><span data-v-ccfa68c6="" class="count">26</span></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><div data-v-e232e062="" data-v-02a6947c="" data-v-ccfa68c6="" data-src="https://user-gold-cdn.xitu.io/2020/6/16/172bb36aadfb373f?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1" class="lazy thumb thumb loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2020/6/16/172bb36aadfb373f?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1&quot;); background-size: cover;"></div></div></a></div></div></li><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5ee9c9b9f265da02e12b9cb8|5" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee9c98c6fb9a0587c6b136c" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="5b52fd38f265da0f4c6fbd72" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/5b52fd38f265da0f4c6fbd72" target="_blank" rel="" st:name="user" st:state="5b52fd38f265da0f4c6fbd72" data-v-1d890915="">lzg9527</a></div></li><li data-v-ccfa68c6="" class="item">1天前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee9c98c6fb9a0587c6b136c" target="_blank" rel="" st:name="title" class="title">总结18个webpack插件，总会有你想要的！</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">211</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee9c98c6fb9a0587c6b136c#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><span data-v-ccfa68c6="" class="count">12</span></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><div data-v-e232e062="" data-v-02a6947c="" data-v-ccfa68c6="" data-src="https://user-gold-cdn.xitu.io/2020/6/17/172c13bc500255ab?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1" class="lazy thumb thumb" style="background-image: none; background-size: cover;"></div></div></a></div></div></li><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5eeb8c4d6fb9a058523bd03b|6" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeb8c2cf265da02bb1ebf25" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="5c0f26e16fb9a049a570be39" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/5c0f26e16fb9a049a570be39" target="_blank" rel="" st:name="user" st:state="5c0f26e16fb9a049a570be39" data-v-1d890915="">BUPPT</a></div></li><li data-v-ccfa68c6="" class="item">15小时前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeb8c2cf265da02bb1ebf25" target="_blank" rel="" st:name="title" class="title">从零写一个 Vue（四）虚拟 DOM</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">2</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeb8c2cf265da02bb1ebf25#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><!----></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><!----></div></a></div></div></li><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5ee820cb5188251fa072f127|7" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee73e416fb9a047d564704e" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="5e8558f3518825738f2b1327" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/5e8558f3518825738f2b1327" target="_blank" rel="" st:name="user" st:state="5e8558f3518825738f2b1327" data-v-1d890915="">阿里巴巴淘系技术</a></div></li><li data-v-ccfa68c6="" class="item">3天前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee73e416fb9a047d564704e" target="_blank" rel="" st:name="title" class="title">大厂如何开发和部署前端代码？淘宝8年案例解读</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">141</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5ee73e416fb9a047d564704e#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><span data-v-ccfa68c6="" class="count">16</span></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><div data-v-e232e062="" data-v-02a6947c="" data-v-ccfa68c6="" data-src="https://user-gold-cdn.xitu.io/2020/6/15/172b755c323ed5a0?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1" class="lazy thumb thumb" style="background-image: none; background-size: cover;"></div></div></a></div></div></li><li data-v-687302b1="" data-growing-container="true" data-growing-title="entryList" class="item"><div data-v-749496f0="" data-v-687302b1="" class="entry-box"><div data-v-ccfa68c6="" data-v-749496f0="" st:block="entry" st:state="5eeb792a51882565c45a3ddd|8" class="entry"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeb785251882565a762e50f" target="_blank" rel="" st:name="link" class="entry-link"><div data-v-ccfa68c6="" class="content-box"><div data-v-ccfa68c6="" class="info-box"><div data-v-ccfa68c6="" class="info-row meta-row"><ul data-v-ccfa68c6="" class="meta-list"><!----><!----><li data-v-ccfa68c6="" class="item post">专栏</li><li data-v-ccfa68c6="" class="item username clickable"><div data-v-1d890915="" data-v-ccfa68c6="" st:block="userPopover" st:state="5b507a156fb9a04f8e1427d4" class="user-popover-box"><!----><a data-v-ccfa68c6="" href="https://juejin.im/user/5b507a156fb9a04f8e1427d4" target="_blank" rel="" st:name="user" st:state="5b507a156fb9a04f8e1427d4" data-v-1d890915="">淘系前端团队FED</a></div></li><li data-v-ccfa68c6="" class="item">16小时前</li><li data-v-ccfa68c6="" class="item tag"><a data-v-ccfa68c6="" href="https://juejin.im/tag/%E5%89%8D%E7%AB%AF" target="_blank" rel="" st:name="tag" st:state="5597a05ae4b08a686ce56f6f" class="tag">前端</a></li><!----></ul></div><div data-v-ccfa68c6="" class="info-row title-row"><!----><!----><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeb785251882565a762e50f" target="_blank" rel="" st:name="title" class="title">揭秘手淘召唤术| 帮助千万级用户直达手淘的黑科技</a></div><div data-v-ccfa68c6="" class="info-row action-row"><ul data-v-ccfa68c6="" class="action-list"><li data-v-ccfa68c6="" st:name="likeBtn" class="item like clickable"><a data-v-ccfa68c6="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-ccfa68c6="" class="count">23</span></a></li><li data-v-ccfa68c6="" st:name="commentBtn" class="item comment clickable"><a data-v-ccfa68c6="" href="https://juejin.im/post/5eeb785251882565a762e50f#comment" target="_blank" rel="" class="title-box"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.4d5744f.svg" class="icon"><span data-v-ccfa68c6="" class="count">6</span></a></li><li data-v-ccfa68c6="" st:name="shareBtn" title="分享" class="item share clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/share.1d55e69.svg" class="icon"><div data-v-ccfa68c6="" class="share-panel"><div data-v-ccfa68c6="" st:name="shareItem" st:state="weibo" class="share-item weibo"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/weibo.8e2f5d6.svg" class="icon">微博</div><div data-v-ccfa68c6="" st:name="shareItem" st:state="wechat" class="share-item wechat"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/wechat.844402c.svg" class="icon">微信扫一扫<div data-v-ccfa68c6="" class="qr-code-box"><img data-v-ccfa68c6="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="qr-code"></div></div></div></li><li data-v-ccfa68c6="" title="收藏" st:name="collectBtn" class="item collect clickable hover"><img data-v-ccfa68c6="" src="./深入理解贝塞尔曲线 - 掘金_files/collect.02e2979.svg" class="icon"><!----></li><!----></ul></div></div><div data-v-e232e062="" data-v-02a6947c="" data-v-ccfa68c6="" data-src="https://user-gold-cdn.xitu.io/2020/6/18/172c7e1b24b5c098?imageView2/1/w/120/h/120/q/85/format/webp/interlace/1" class="lazy thumb thumb" style="background-image: none; background-size: cover;"></div></div></a></div></div></li><li data-v-687302b1="" class="item"><!----></li><!----></ul></div><div data-v-bd87ff56="" data-v-0b1a4f9a="" st:block="sidebar" class="sidebar sidebar top sticky" data-v-575c8a08=""><div data-v-8994b7e2="" data-v-2c6cf58a="" data-v-bd87ff56="" class="sidebar-block author-block shadow"><div data-v-8994b7e2="" class="block-title">关于作者</div><div data-v-8994b7e2="" class="block-body"><a data-v-2c6cf58a="" href="https://juejin.im/user/57de657179bc440065e34999" target="_blank" rel="" class="user-item item" data-v-8994b7e2=""><div data-v-e232e062="" data-v-4bc4293a="" data-v-2c6cf58a="" data-src="https://user-gold-cdn.xitu.io/2016/11/30/cf6efcedc766022278fc65bc2daa8dd2?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1" class="lazy avatar avatar loaded" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2016/11/30/cf6efcedc766022278fc65bc2daa8dd2?imageView2/1/w/100/h/100/q/85/format/webp/interlace/1&quot;);"></div><div data-v-2c6cf58a="" class="info-box"><a data-v-b8de4708="" data-v-2c6cf58a="" href="https://juejin.im/user/57de657179bc440065e34999" target="_blank" rel="" class="username">与我常在Jerry<a data-v-b9e98e56="" data-v-b8de4708="" href="https://juejin.im/book/5c90640c5188252d7941f5bb/section/5c9065385188252da6320022" target="_blank" rel="" class="rank"><img data-v-b9e98e56="" src="./深入理解贝塞尔曲线 - 掘金_files/lv-2.f597b88.svg" alt="lv-2"></a></a><div data-v-2c6cf58a="" title="Web前端工程师 @ Rockontrol" class="position">Web前端工程师 @ Rockontrol</div></div></a><div data-v-2c6cf58a="" data-v-8994b7e2="" class="stat-item item"><svg data-v-2c6cf58a="" data-v-8994b7e2="" xmlns="http://www.w3.org/2000/svg" width="25" height="26" viewBox="0 0 25 26" class="zan"><g data-v-2c6cf58a="" data-v-8994b7e2="" fill="none" fill-rule="evenodd" transform="translate(0 .57)"><ellipse data-v-2c6cf58a="" data-v-8994b7e2="" cx="12.5" cy="12.57" fill="#E1EFFF" rx="12.5" ry="12.57"></ellipse> <path data-v-2c6cf58a="" data-v-8994b7e2="" fill="#7BB9FF" d="M8.596 11.238V19H7.033C6.463 19 6 18.465 6 17.807v-5.282c0-.685.483-1.287 1.033-1.287h1.563zm4.275-4.156A1.284 1.284 0 0 1 14.156 6c.885.016 1.412.722 1.595 1.07.334.638.343 1.687.114 2.361-.207.61-.687 1.412-.687 1.412h3.596c.38 0 .733.178.969.488.239.317.318.728.21 1.102l-1.628 5.645a1.245 1.245 0 0 1-1.192.922h-7.068v-7.889c1.624-.336 2.623-2.866 2.806-4.029z"></path></g></svg> <span data-v-2c6cf58a="" data-v-8994b7e2="" class="content">获得点赞<span data-v-2c6cf58a="" data-v-8994b7e2="" class="count">515</span></span></div><div data-v-2c6cf58a="" data-v-8994b7e2="" class="stat-item item"><svg data-v-2c6cf58a="" data-v-8994b7e2="" width="25" height="25" viewBox="0 0 25 25" class="icon stat-view-icon"><g data-v-2c6cf58a="" data-v-8994b7e2="" fill="none" fill-rule="evenodd"><circle data-v-2c6cf58a="" data-v-8994b7e2="" cx="12.5" cy="12.5" r="12.5" fill="#E1EFFF"></circle> <path data-v-2c6cf58a="" data-v-8994b7e2="" fill="#7BB9FF" d="M4 12.5S6.917 7 12.75 7s8.75 5.5 8.75 5.5-2.917 5.5-8.75 5.5S4 12.5 4 12.5zm8.75 2.292c1.208 0 2.188-1.026 2.188-2.292 0-1.266-.98-2.292-2.188-2.292-1.208 0-2.188 1.026-2.188 2.292 0 1.266.98 2.292 2.188 2.292z"></path></g></svg> <span data-v-2c6cf58a="" data-v-8994b7e2="" class="content">文章被阅读<span data-v-2c6cf58a="" data-v-8994b7e2="" class="count">18,491</span></span></div><!----></div></div><!----><div data-v-8994b7e2="" data-v-536ff69e="" data-v-1b0cded9="" data-v-bd87ff56="" class="sidebar-block recommend recommend-index shadow"><div data-v-8994b7e2="" class="block-title">你可能感兴趣的小册</div><div data-v-8994b7e2="" class="block-body"><div data-v-536ff69e="" data-v-8994b7e2="" class="book-list"><div data-v-536ff69e="" data-v-8994b7e2="" class="book"><div data-v-536ff69e="" data-v-8994b7e2="" class="poster"><div data-v-e232e062="" data-v-02a6947c="" data-v-536ff69e="" data-src="https://user-gold-cdn.xitu.io/2018/6/26/1643b682a5be1090?imageView2/1/w/200/h/280/q/95/format/webp/interlace/1" class="lazy thumb poster-img loaded" data-v-8994b7e2="" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2018/6/26/1643b682a5be1090?imageView2/1/w/200/h/280/q/95/format/webp/interlace/1&quot;); background-size: cover;"></div></div><div data-v-536ff69e="" data-v-8994b7e2="" class="info"><div data-v-536ff69e="" data-v-8994b7e2="" class="title">基于 Go 语言构建企业级的 RESTful API 服务</div><div data-v-536ff69e="" data-v-8994b7e2="" class="bought"><span data-v-536ff69e="" data-v-8994b7e2="" class="num">3407人已购买</span><span data-v-536ff69e="" data-v-8994b7e2="" class="try-read">试读</span></div></div></div><div data-v-536ff69e="" data-v-8994b7e2="" class="book"><div data-v-536ff69e="" data-v-8994b7e2="" class="poster"><div data-v-e232e062="" data-v-02a6947c="" data-v-536ff69e="" data-src="https://user-gold-cdn.xitu.io/2018/11/27/16754380a4c1a096?imageView2/1/w/200/h/280/q/95/format/webp/interlace/1" class="lazy thumb poster-img loaded" data-v-8994b7e2="" style="background-image: url(&quot;https://user-gold-cdn.xitu.io/2018/11/27/16754380a4c1a096?imageView2/1/w/200/h/280/q/95/format/webp/interlace/1&quot;); background-size: cover;"></div></div><div data-v-536ff69e="" data-v-8994b7e2="" class="info"><div data-v-536ff69e="" data-v-8994b7e2="" class="title">Vue 项目构建与开发入门</div><div data-v-536ff69e="" data-v-8994b7e2="" class="bought"><span data-v-536ff69e="" data-v-8994b7e2="" class="num">5291人已购买</span><span data-v-536ff69e="" data-v-8994b7e2="" class="try-read">试读</span></div></div></div></div></div></div><div data-v-8994b7e2="" data-v-76c56443="" data-v-bd87ff56="" class="sidebar-block app-download-sidebar-block shadow"><!----><div data-v-8994b7e2="" class="block-body"><a data-v-76c56443="" data-v-8994b7e2="" class="app-link" href="https://juejin.im/app" target="_blank"><img data-v-76c56443="" data-v-8994b7e2="" src="./深入理解贝塞尔曲线 - 掘金_files/post.7cb7332.png" class="qr-img"><div data-v-76c56443="" data-v-8994b7e2="" class="content-box"><div data-v-76c56443="" data-v-8994b7e2="" class="headline">下载掘金客户端</div><div data-v-76c56443="" data-v-8994b7e2="" class="desc">一个帮助开发者成长的社区</div></div><div data-v-76c56443="" data-v-8994b7e2="" title="关闭" class="close-btn ion-close-round"></div></a></div></div><div data-v-8994b7e2="" data-v-079dd230="" data-v-bd87ff56="" class="sidebar-block wechat-sidebar-block pure"><div data-v-65655b8a="" data-v-079dd230="" class="wechat-banner" data-v-8994b7e2=""><img data-v-65655b8a="" src="./深入理解贝塞尔曲线 - 掘金_files/frontend.1dae74a.png" class="wechat-img"></div><div data-v-079dd230="" data-v-8994b7e2="" title="关闭" class="close-btn ion-close-round"></div></div><div data-v-8994b7e2="" data-v-083ea79d="" data-v-bd87ff56="" class="sidebar-block related-entry-sidebar-block shadow" st:block="relatedEntrySidebarBlock"><div data-v-8994b7e2="" class="block-title">相关文章</div><div data-v-8994b7e2="" class="block-body"><div data-v-083ea79d="" data-v-8994b7e2="" class="entry-list"><a data-v-083ea79d="" href="https://juejin.im/post/5eec270ce51d4574220aa67d" target="_blank" rel="" st:name="link" class="item" data-v-8994b7e2=""><div data-v-083ea79d="" class="entry-title">你知道自己的代码在线上有多少问题吗</div><div data-v-083ea79d="" class="entry-meta-box"><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-083ea79d="" class="count">30</span></div><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.a7c8341.svg" class="icon"><span data-v-083ea79d="" class="count">1</span></div></div></a><a data-v-083ea79d="" href="https://juejin.im/post/5eec09b9f265da02bb1ebf64" target="_blank" rel="" st:name="link" class="item" data-v-8994b7e2=""><div data-v-083ea79d="" class="entry-title">微前端连载 1：如何落地微前端一体化运营工作台</div><div data-v-083ea79d="" class="entry-meta-box"><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-083ea79d="" class="count">34</span></div><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.a7c8341.svg" class="icon"><span data-v-083ea79d="" class="count">5</span></div></div></a><a data-v-083ea79d="" href="https://juejin.im/post/5eeae4f7e51d4574195ed982" target="_blank" rel="" st:name="link" class="item" data-v-8994b7e2=""><div data-v-083ea79d="" class="entry-title">不想痛失薪资普调和年终奖？试试自动化测试！（基础篇）</div><div data-v-083ea79d="" class="entry-meta-box"><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-083ea79d="" class="count">118</span></div><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.a7c8341.svg" class="icon"><span data-v-083ea79d="" class="count">20</span></div></div></a><a data-v-083ea79d="" href="https://juejin.im/post/5ee8c60ef265da76ed486e20" target="_blank" rel="" st:name="link" class="item" data-v-8994b7e2=""><div data-v-083ea79d="" class="entry-title">10个打开了我新世界大门的 WebAPI</div><div data-v-083ea79d="" class="entry-meta-box"><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-083ea79d="" class="count">449</span></div><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.a7c8341.svg" class="icon"><span data-v-083ea79d="" class="count">35</span></div></div></a><a data-v-083ea79d="" href="https://juejin.im/post/5eeab9d051882565c0796312" target="_blank" rel="" st:name="link" class="item" data-v-8994b7e2=""><div data-v-083ea79d="" class="entry-title">进大厂连载 3/15：如何借助 5 道算法题入职 Leetcode</div><div data-v-083ea79d="" class="entry-meta-box"><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/zan.e9d7698.svg" class="icon"><span data-v-083ea79d="" class="count">58</span></div><div data-v-083ea79d="" class="entry-meta"><img data-v-083ea79d="" src="./深入理解贝塞尔曲线 - 掘金_files/comment.a7c8341.svg" class="icon"><span data-v-083ea79d="" class="count">3</span></div></div></a></div></div></div><div data-v-bd87ff56="" class="sticky-block-box"><div data-v-8994b7e2="" data-v-2757de2e="" data-v-bd87ff56="" class="sidebar-block catalog-block pure"><nav data-v-0265697d="" data-v-2757de2e="" class="article-catalog" data-v-8994b7e2="" style=""><div data-v-0265697d="" class="catalog-title">目录</div><div data-v-0265697d="" class="catalog-body"><ul data-v-0265697d="" class="catalog-list" style="margin-top: 0px;"><li data-v-0265697d="" class="item d1"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-0" title="文章目录">文章目录</a><!----></li><li data-v-0265697d="" class="item d1"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-1" title="一、什么是贝塞尔曲线？">一、什么是贝塞尔曲线？</a><!----></li><li data-v-0265697d="" class="item d1"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-2" title="二、贝塞尔曲线分为哪些类型？">二、贝塞尔曲线分为哪些类型？</a><!----></li><li data-v-0265697d="" class="item d1 active"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-3" title="三、贝塞尔曲线是如何绘制出来的？">三、贝塞尔曲线是如何绘制出来的？</a><!----></li><li data-v-0265697d="" class="item d1"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-4" title="四、如何求贝塞尔曲线上的点坐标？">四、如何求贝塞尔曲线上的点坐标？</a><ul class="sub-list"><li class="item d2"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-5" title="1、一阶贝塞尔曲线">1、一阶贝塞尔曲线</a><!----></li><li class="item d2"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-6" title="2、二阶贝塞尔曲线">2、二阶贝塞尔曲线</a><!----></li><li class="item d2"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-7" title="3、三阶贝塞尔曲线">3、三阶贝塞尔曲线</a><!----></li><li class="item d2"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-8" title="4、多阶贝塞尔曲线">4、多阶贝塞尔曲线</a><!----></li></ul></li><li data-v-0265697d="" class="item d1"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-9" title="五、如何实现一个类似CSS中easing属性的三阶贝塞尔曲线构造函数？">五、如何实现一个类似CSS中easing属性的三阶贝塞尔曲线构造函数？</a><!----></li><li data-v-0265697d="" class="item d1"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-10" title="六、如何用高阶贝塞尔曲线表示低阶贝塞尔曲线？">六、如何用高阶贝塞尔曲线表示低阶贝塞尔曲线？</a><ul class="sub-list"><li class="item d2"><a href="https://juejin.im/post/5b854e1451882542fe28a53d#heading-11" title="参考文献">参考文献</a><!----></li></ul></li></ul></div></nav></div></div></div><div data-v-0c700a3a="" data-v-0b1a4f9a="" class="article-suspended-panel article-suspended-panel" data-v-575c8a08=""><div data-v-0c700a3a="" class="like-btn panel-btn like-adjust with-badge" badge="306"></div><div data-v-0c700a3a="" class="comment-btn panel-btn comment-adjust with-badge" badge="31"></div><div data-v-0c700a3a="" class="collect-btn panel-btn"><!----></div><div data-v-0c700a3a="" class="share-title">分享</div><div data-v-0c700a3a="" class="weibo-btn share-btn panel-btn"></div><div data-v-0c700a3a="" class="qq-btn share-btn panel-btn"></div><div data-v-0c700a3a="" class="wechat-btn share-btn panel-btn"><img data-v-0c700a3a="" src="https://juejin.im/post/5b854e1451882542fe28a53d" class="wechat-qr-code-img shadow" style="display: none;"></div></div><div data-v-fa31c83e="" data-v-0b1a4f9a="" class="image-viewer-box" data-v-575c8a08=""><!----></div><!----></div></main></div><!----></div>
      
      
      
      <script type="text/javascript" src="./深入理解贝塞尔曲线 - 掘金_files/runtime.301e7eea7ec3246f8b8c.js.下载"></script><script type="text/javascript" src="./深入理解贝塞尔曲线 - 掘金_files/0.a87cc5a01e86d5927346.js.下载"></script><script type="text/javascript" src="./深入理解贝塞尔曲线 - 掘金_files/1.42309921c134e997dc82.js.下载"></script>
    </body></html>